將加載指示器添加到Google地圖infoWindow

當前，當用戶在我們的地圖屏幕上單擊位置標記時，會調用頁面方法從服務器檢索附加信息。當頁面方法成功時，結果用於定義地圖上顯示的infoWindow的內容。在頁面方法很慢的情況下，我們希望infoWindow立即顯示，但帶有一個加載指示器。頁面方法成功後，infowWindow的內容將被更新。將加載指示器添加到Google地圖infoWindow

到目前爲止，我的天真方法是最初創建帶有加載指示器的infoWindow，並通過調用open（map）顯示此初始infoWindow，然後在page方法成功後更新該infoWindow的內容。但是，這種方法不起作用，因爲地圖畫布在頁面方法完成之後纔會更新（因此不會顯示infoWindow的初始版本）。

-----頁面代碼-----

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?v=3.8&client=MY_CLIENT&sensor=false"></script> 

<script type="text/javascript"> 

    function initialize_map() { 
     map = new google.maps.Map(...); 
     // set remaining map properties... 
    } 

    window.onload = function() { 
     initialize_map(); 
    } 

    function DrawPoint(loc) { 
     var marker = GetPointMarker(loc); 
     // set remaining point marker properties... 
     marker.setMap(map); 

     var showPointInfo = function (evt) { 
     var infoWindow = infowindowList[loc]; 
     if (infoWindow == undefined) 
     { 
      GetPointInfoStart(loc); 
      GetPointInfo(loc); 
     } 
     }; 

     google.maps.event.addListener(marker, 'click', showPointInfo); 
    } 

    function GetPointInfoStart(loc) 
    { 
     var infoWindow = new google.maps.InfoWindow(); 
     var content = // initial content with loading indicator 
     infoWindow.setContent(content); 
     // set remaining infoWindow properties... 
     infoWindow.open(map); 
    } 

    function GetPointInfo(loc) 
    { 
     // call page method to retrieve data for infoWindow 
     PageMethods.GetMapPointInfo(..., OnGetPointInfoSuccess, OnFailure); 
    } 

    function OnGetPointInfoSuccess(result) { 
     eval(result); 
     var infoWindow = infowindowList[loc]; 
     var content = // final content with retrieved data 
     infoWindow.setContent(content); 
    } 

</script>

-----代碼背後-----

protected override void OnInit(EventArgs e) 
{ 
    ScriptManager.GetCurrent(this).EnablePageMethods = true; 
    ... 
    base.OnInit(e); 
} 

[WebMethod] 
public static string GetMapPointInfo(...) 
{ 
    // retrieve point information from server... 
    return jsonString; 
}

來源

2012-06-11 user1449692

我發現了一個bug如何初始內容正在被定義。隨着內容被正確定義，方法（如上）現在正在工作。

來源

2012-06-12 14:57:56 user1449692

將加載指示器添加到Google地圖infoWindow

回答

相關問題