【问题标题】:Link Multiple Markers from XML on Google Maps [duplicate]在 Google 地图上从 XML 链接多个标记[重复]
【发布时间】:2013-05-15 07:08:40
【问题描述】:

我能够从 XML 文件中提取我的标记并将它们放置在 Google 地图上,但现在我希望每个标记在单击后链接到其各自的 url。有人可以让我知道我做错了什么吗?出于某种原因,我只获得了最后一个条目的网址。

downLoad("phpsqlajax.php", function(data) {
    var xml = data.responseXML;
    var markers = xml.documentElement.getElementsByTagName("marker");
    for (var i = 0; i < markers.length; i++) {
        var city = markers[i].getAttribute("city");
        var state = markers[i].getAttribute("state");
        var country = markers[i].getAttribute("country");
        var markerUrl = markers[i].getAttribute("url");
        var point = new google.maps.LatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng")));
        var marker = new google.maps.Marker({
            position: point,
            map: googleMap,
            icon: 'map-pin.png',
            url: markerUrl
        });
        google.maps.event.addListener(marker, 'click', function() {
            window.location.href = marker.url;
        });
    }
});

【问题讨论】:

  • 我不知道我是否足够了解函数闭包以使其正常工作
  • 查看我关于如何使用 createMarker 函数的答案。

标签: javascript google-maps xml-parsing


【解决方案1】:

像这样创建标记函数(未测试):

function createMarker(point, url) {
    var marker = new google.maps.Marker({
        position: point,
        map: googleMap,
        icon: 'map-pin.png',
        url: markerUrl
    });
    google.maps.event.addListener(marker, 'click', function() {
        window.location.href = marker.url;
    });
}

然后这样称呼它:

downLoad("phpsqlajax.php", function(data) {
    var xml = data.responseXML;
    var markers = xml.documentElement.getElementsByTagName("marker");
    for (var i = 0; i < markers.length; i++) {
        var city = markers[i].getAttribute("city");
        var state = markers[i].getAttribute("state");
        var country = markers[i].getAttribute("country");
        var markerUrl = markers[i].getAttribute("url");
        var point = new google.maps.LatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng")));
        createMarker(point, markerUrl);
    }
});

【讨论】:

猜你喜欢
  • 1970-01-01
  • 2018-05-26
  • 2021-02-06
  • 1970-01-01
  • 1970-01-01
  • 2012-01-09
  • 2013-09-20
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多