如何在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}); 
}