Google지도 API - 위도/경도가 동일한 모든 마커에 대한 정보 표시

Songkick.com의 API 데이터를 사용하여 Google지도에서 일부 콘서트 위치를 매핑 중입니다. jQuery를 사용하여 데이터를 호출하고 있습니다. 콘서트를 매핑 할 때 단일 장소에 여러 콘서트가 예약되어 있으면 모든 마커가 정확히 동일한 위치에 배치됩니다. 즉, 가장 최근의 콘서트의 마커 만 표시되며 Google지도의 infoWindow는 가장 최근의 콘서트의 데이터 만 표시합니다.Google지도 API - 위도/경도가 동일한 모든 마커에 대한 정보 표시

위도/경도가 정확히 일치하는 모든 콘서트가 infoWindow에 정보를 표시하도록 만들고 싶습니다. 따라서 마커를 클릭하면 모든 최신 쇼가 최신 쇼뿐만 아니라 infoWindow에 표시됩니다. 여기

내 자바 스크립트의 일부입니다

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

내가 주요 도시의 이름을 입력에 대해 이야기하고있는 것을보고, 떨어지는 마커를 클릭합니다. 가장 최근의 콘서트 만 표시됩니다.

미리 감사드립니다. 도움을 주시면 감사하겠습니다.

출처

2012-03-20 Taylor Ward

SongKick API 호출이 각 장소에 대해 고유 한 ID를 반환하는 것처럼 보입니다. 여기에 할 수있는 일이 있습니다 :

각 이벤트 객체를 배열에 추가하십시오.
배열의 이벤트에서 고유 한 장소 ID를 꺼냅니다.
각 고유 한 장소 ID를 반복하고 해당 이벤트 ID를 사용하여 각 이벤트를 꺼내고이 이벤트의 하위 집합을 반복하여 정보 창 문자열을 작성하십시오.
장소 정보를 사용하여 마커를 작성하고 정보 창 문자열을 마커로 설정합니다.

약간의 JavaScript 코드, 중첩 루프 및 약간의 성능 저하이지만 트릭을 수행해야합니다.

출처

2012-03-20 20:45:32 Gady

Google지도 API - 위도/경도가 동일한 모든 마커에 대한 정보 표시

답변

관련 문제