谷歌地圖V3：通過AJAX加載infowindow內容

使用AJAX將內容加載到我的infowindow中的最佳方式是什麼？現在我正在使用iframe獲得類似的效果，但我並不那麼滿意。我認爲這將是直接的，但由於某種原因令我困惑。這就是它的工作現在：谷歌地圖V3：通過AJAX加載infowindow內容

var markers = []; 
    var infowindow = new google.maps.InfoWindow(); 
    $.each(JSON.parse(aulas), function(i, a){ 

    var latlng = new google.maps.LatLng(a.aula.lat, a.aula.lng); 
    var marker = new google.maps.Marker({ 
     position : latlng, 
     title: a.aula.title 
    }); 

    google.maps.event.addListener(marker, 'click', function() { 
     infowindow.close(); 
     infowindow.setContent("<div class='infowindow_content'><iframe src='aulas/show/" + a.aula.id + "'></iframe</div>"); 

     infowindow.open(map, marker); 
    }); 
    markers.push(marker); 
    });

人很容易就在infowindow.setContent調用之前搶到通過AJAX的內容，但我想要的信息窗口打開的時候才使Ajax調用。有什麼想法嗎？

順便說一句：我正在使用jQuery。

正如答案中的建議，我決定將調用移動到setContent並打開到一個單獨的函數。對於那些有興趣的是解決了這個代碼是：

function load_content(marker, id){ 
    $.ajax({ 
    url: 'aulas/show/' + id, 
    success: function(data){ 
     infowindow.setContent(data); 
     infowindow.open(map, marker); 
    } 
    }); 
}

然後改變監聽器：

google.maps.event.addListener(marker, 'click', function() { 
     infowindow.close(); 
     load_content(marker, a.aula.id); 
    }); 
    markers.push(marker); 
    });

來源

2010-08-01 mikewilliamson

讓我知道如果我需要澄清我的回答:) – RedBlueThing 2010-08-02 06:38:53

不，那是完美的。我的想法變得混亂了，我只需要輕輕地向正確的方向推動。謝謝！ – mikewilliamson 2010-08-02 22:47:05

沒問題:)很高興幫助。 – RedBlueThing 2010-08-02 23:39:11

你可以在任何地方調用infowindow.setContent已經顯示出信息窗口後。因此，您可以使用微調器初始設置您的信息窗口內容，使AJAX調用（來自事件處理程序），然後再次使用適當的數據從AJAX響應中調用infowindow.setContent。

來源

2010-08-01 13:30:55 RedBlueThing

for (var i = 0; i < markersClient.length; i++) { 
      var location = new google.maps.LatLng(lats[i], longs[i]); 
      var marker = new google.maps.Marker({ 
       position: location, 
       map: map, 
       lid: markersClient[i].t 
      }); 
      var infowindow = new google.maps.InfoWindow({ 
       content: "" 
      }); 
      //debugger; 
      marker.setTitle(" - "); 
      markers.push(marker); 
      google.maps.event.addListener(marker, 'click', function (target, elem) { 
       infowindow.open(map, marker); 
       $.ajax({ 
         success:function() { 
         infowindow.setContent(contentString); 
        } 
       });

intitalize地圖，標記，信息窗口（如沒有內容）和標記的點擊處理使Ajax請求

來源

2013-10-18 07:49:51

點擊了哪個標記，如何從市場向ajax發送參數？ – Marwan 2017-10-22 10:49:40

這是錯誤的方法，因爲它每次點擊標記時都是ajax。嘗試通過ajax加載最初的所有內容並進行渲染。 – 2017-11-15 09:42:34

@ashishbansal，你可以通過設置一些變量到該範圍來通過AJAX有條件地加載內容。 – 2017-11-20 12:57:40

已經在內容的信息窗口加載，但也有可能，如果你上傳的圖片大尺寸，那麼我們必須等待第一次完全加載圖像，然後設置infowindow的內容，然後顯示該infowindow。上述要求的解決方案是可以的，但對於可能無法立即加載的圖像，要做到這一點，您必須檢查infowindow的內容是否已加載，只有您必須顯示信息窗口。

來源

2015-05-22 05:05:29 bikashphp

谷歌地圖V3：通過AJAX加載infowindow內容

回答

相關問題