Question

我使用Songkick.com API的数据在谷歌地图上映射一些音乐会地点。我正在使用jQuery调用数据。在映射音乐会时，如果单个场地安排了多个音乐会，则所有标记都放置在完全相同的位置。这意味着只有最近一次音乐会的标记可见，而谷歌地图infoWindow仅显示最近一次音乐会的数据。

我想这样做，以便在完全相同的纬度/经度上发生的所有音乐会在infoWindow中显示他们的信息。因此，当您单击标记时，所有预定的节目都会显示在infoWindow中，而不仅仅是最近的节目。

以下是我的javascript的一部分：

function doSearch(locations) {
deleteOverlays();
jQuery.getJSON("http://api.songkick.com/api/3.0/search/locations.json?query=" + locations + "&apikey=XXXXXXXX&jsoncallback=?", function(data){
    var id = data.resultsPage.results.location[0].metroArea.id;

    jQuery.getJSON("http://api.songkick.com/api/3.0/metro_areas/" + id + "/calendar.json?apikey=XXXXXXXX&jsoncallback=?", function(data){
        var bounds = new google.maps.LatLngBounds();
        var point;
        $.each(data.resultsPage.results.event, function(i, item) {
            var event = item;
            point  = new google.maps.LatLng(
                parseFloat(item.location.lat),
                parseFloat(item.location.lng));
            var marker = new google.maps.Marker({
                map      : map,
                animation: google.maps.Animation.DROP,
                position : point

            });

            markersArray.push(marker);

            var contentString = '<p><b>' + item.displayName + '</b></p>' + '<p>' + item.location.city + '</p>';

            var infowindow = new google.maps.InfoWindow({
                content: contentString
            });

google.maps.event.addListener(marker, 'click', function() {

                if (currentInfoWindow != null) { 
                    currentInfoWindow.close(); 
                } 
                infowindow.open(map, marker); 
                currentInfoWindow = infowindow;
            });

要查看此应用程序的运行情况，我已经设置了一个临时网站。

http://129.219.78.186/~masgis/tward/songkick/Metro.html

要查看我在说什么，请输入主要城市的名称，然后点击丢弃的标记。只有最近的音乐会才会出现。

在此先感谢，非常感谢任何帮助。

Answer 1

看起来SongKick API调用会为每个场所返回一个唯一的ID。所以这就是你能做的：

将每个事件对象添加到数组中。
从阵列中的事件中提取唯一的场地ID。
遍历每个唯一的场地ID，使用该场地ID拉出每个事件，并通过循环遍历此事件子集来构建信息窗口字符串。
使用场地信息构建标记，将信息窗口字符串设置为标记。

这是一些JavaScript代码，嵌套循环和一点性能损失，但应该可以解决这个问题。

Google Maps API - 显示具有相同纬度/经度的所有标记的信息

1 个答案: