2012-03-20 4 views
1

Я сопоставляю некоторые местоположения концертов на картах Google, используя данные из API Songkick.com. Я делаю вызов данных с помощью jQuery. При отображении концерта, если в одном месте запланировано несколько концертов, все маркеры размещаются в одном и том же месте. Это означает, что отображается только маркер самого последнего концерта, а на картах google mapsWindow отображаются только данные для этого последнего концерта.API Карт Google - отображать информацию обо всех маркерах с одинаковыми латами/длинными

Я хотел бы сделать так, чтобы все концерты, проходящие на том же самом широтном экране, отображали свою информацию в информационном окне. Поэтому, когда вы нажимаете на маркер, все запланированные показы отображаются в окне 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

Чтобы увидеть, что я имею в виду, введите название крупного города, и выберите маркер, который падает. Появится только последний концерт.

Заранее благодарю за любую помощь.

ответ

1

Похоже, что вызов API SongKick возвращает уникальный идентификатор для каждого места. Итак, вот что вы можете сделать:

  1. Добавить каждый объект события в массив.
  2. Выдвиньте уникальные идентификаторы места из событий в массиве.
  3. Пронумеруйте каждый уникальный идентификатор места, вытаскивая каждое событие с этим идентификатором места и стройте строку информационного окна, перейдя через это подмножество событий.
  4. Постройте маркер с помощью информации о месте проведения, установив строку информационного окна в маркер.

Это немного код JavaScript, вложенные циклы и бит производительности, но он должен сделать трюк.

 Смежные вопросы

  • Нет связанных вопросов^_^