Question

这是一个XML条目，需要从PHP表单进行地理定位。我想在HTML中将这些值显示为地图：

 <entries>
   <entry>
   <name>Anny</name>
   <email>anny1@hotmail.com</email>
   <place>Fridays</place>
   <comment>Very Good</comment>
   <food>Jack Daniels Burger</food>
   <kitchen>American</kitchen>
   <rating>5</rating>
   <latitude>34.7618259</latitude>
   <longitude>33.0283905</longitude>
   <picture/>
   </entry>
</entries>

Answer 1

我想假设这些LatLong点作为标记显示。以下是在谷歌地图中如何做到这一点。

var myLatlng = new google.maps.LatLng(-25.363882,131.044922);

var marker = new google.maps.Marker({
 position: myLatlng,
 title:"Hello World!"
});

// To add the marker to the map, call setMap();
marker.setMap(map);

在https://developers.google.com/maps/documentation/javascript/markers

了解详情

同样地，你可以在mapbox中这样做

L.mapbox.featureLayer({
// this feature is in the GeoJSON format: see geojson.org
// for the full specification
type: 'Feature',
geometry: {
    type: 'Point',
    // coordinates here are in longitude, latitude order because
    // x, y is the standard for GeoJSON and many formats
    coordinates: [
      -77.03221142292,
      38.913371603574 
    ]
}).addTo(map);

Answer 2

你是如何生成这个XML的？我假设你使用PHP来生成它。这里将通过JavaScript进行，假设您使用google-maps API。

也许这可以让你开始：

 var xml = "your xml file"          
     markers = xml.documentElement.getElementsByTagName("marker");
    for (var i = 0; i < markers.length; i++) {
      var name = entries[i].getAttribute("name"); 
      var email = entries[i].getAttribute("email");
      var place ..... an so on
  var lat = entries[i].getAttribute("latitude");
  var lng = entries[i].getAttribute("longitude");

  //the creation of point
  point = new google.maps.LatLng(
          lat,
          lng);
    //create actual marker 
  marker = new google.maps.Marker({
    map: map,
    position: point,
     });

创建信息窗口：

 infoWindow = new google.maps.InfoWindow;
var html =  name + "&nbsp;" + email + '&nbsp;' place ; //+ ... whatever else 

bindInfoWindow(marker, map, infoWindow, html);

function bindInfoWindow(marker, map, infoWindow, html) {
      google.maps.event.addListener(marker, 'click', function() {
          infoWindow.close();
        infoWindow.setContent(html);
        infoWindow.open(map, marker, html);
        map.setCenter(marker.getPosition()); // this will center the map on the clicked marker

      });
    }

希望其中一些可以提供帮助

如何在地图上显示来自XML的经度和纬度值的位置

2 个答案: