如何在bing地圖中居中顯示信息框？

Question

我的代碼沒有.pantolatlong然後a .showinfobox

信息框不會出現，除非我刪除pantolatlong。我想它正在阻止它。我試圖將其添加到endpan事件，但沒有奏效。

平移圖釘並顯示信息框的最簡單方法是什麼？

我正在使用setcenter，但是我發現有時使用setcenter平底鍋，而這會打破它。

Answer 1

經過一番瘋狂的谷歌搜索後，我想出瞭解決方案，我會在這裏分享它，以便其他人可以希望沒有我經歷的悲痛。

我創建並使用純javascript，無sdk或iframe解決方案強制我的bing地圖。在我的代碼中，我生成了javascript以將所有我想要的貼圖添加到地圖，並使用asp.net標籤注入它。

如果您在Bing地圖上調用setCenter（）方法，則應該立即將地圖設置爲您所指定的座標，讓您驚喜不已。而且大部分時間都是這樣。有時候，它決定在點之間平移。如果你做一個SetCenter，然後是一個ShowInfoBox，它會很好，除非它決定平移。

解決方案？作爲優秀的程序員，我們深入sdk，揭示了我們可以處理的事件。有一個pan事件，在pan完成後觸發。還有一個onchangeview事件，在地圖跳轉時觸發。

因此，我們鉤入這些事件，並嘗試顯示我們的圖釘形狀的信息框...但沒有任何反應。爲什麼不？

當事件被調用時，你必須給它幾毫秒的時間來吸引呼吸，原因不明。使用10毫秒的setTimeout似乎很好。在這之後你的盒子會顯得很棒。

接下來的問題是，你只希望當它通過任何你用來使它在你的圖釘之間輕彈（在我的情況下，一個表與onclick方法）時出現。儘管還有其他選項，例如使用全局變量來跟蹤用戶是否正在平移，或者系統是否響應點擊而平移，我仍然可以創建/銷燬事件處理程序。

最後，你有一個來自這個問題的錯誤。如果您單擊列表中的某個地方，並跳轉到該地點，信息框將顯示正常。如果用戶解散它，然後再次點擊列表項，地圖不會移動，因此不會觸發任何事件。

我對此的解決方案是通過記錄其長/經度，並使用另一個setTimeout方法來檢測地圖是否移動，檢測它們是否在100ms後改變。如果他們沒有，則顯示信息框。

您還需要跟蹤其他事情，因爲我無法將參數傳遞給事件處理程序，所以我使用全局JavaScript變量 - 您必須知道您顯示的圖釘形狀，以及在查看是否改變之前，還要跟蹤以前的地圖座標。

我花了一段時間纔將所有這些組合在一起，但它似乎工作。這裏是我的代碼，有些部分被刪除：

// An array of our pins to allow panning to them 
var myPushPins = []; 

// Used by the eventhandler 
var eventPinIndex; 
var oldMapCenter; 

// Zoom in and center on a pin, then show its information box 
function ShowPushPin(pinIndex) { 
    eventPinIndex = pinIndex; 
    oldMapCenter = map.GetCenter(); 
    map.AttachEvent("onendpan", EndPanHandler); 
    map.AttachEvent("onchangeview", ChangeViewHandler); 
    setTimeout("DetectNoMapChange();", 200); 

    map.SetZoomLevel(9); 
    map.SetCenter(myPushPins[pinIndex].GetPoints()[0]); 

} 


function EndPanHandler(e) { 
    map.DetachEvent("onendpan", EndPanHandler); 

    setTimeout("map.ShowInfoBox(myPushPins[eventPinIndex]);", 10); 

} 

function ChangeViewHandler(e) { 
    map.DetachEvent("onchangeview", ChangeViewHandler); 

    setTimeout("map.ShowInfoBox(myPushPins[eventPinIndex]);", 10); 

} 

function DetectNoMapChange(centerofmap) { 

    if (map.GetCenter().Latitude == oldMapCenter.Latitude && map.GetCenter().Longitude == oldMapCenter.Longitude) { 
     map.ShowInfoBox(myPushPins[eventPinIndex]); 
    } 
} 

Answer 2

這裏是另一種方式：

function addPushpin(lat,lon,pinNumber) { 
    var pinLocation = new Microsoft.Maps.Location(lat, lon); 

    var pin = new Microsoft.Maps.Pushpin(map.getCenter(), { text: pinNumber.toString() }); 

    pinInfobox = new Microsoft.Maps.Infobox(pinLocation, 
      { title: 'Details', 
       description: 'Latitude: ' + lat.toString() + ' Longitude: ' + lon.toString(), 
       offset: new Microsoft.Maps.Point(0, 15) 
      }); 


    map.entities.push(pinInfobox); 
    map.entities.push(pin); 

    pin.setLocation(pinLocation); 
    map.setView({ center: pinLocation}); 
}