Javascript 在Bing Maps v7中创建多个信息窗口并显示特定于pin的数据

我目前正在尝试学习Bing地图API，并且正在尝试构建一个包含多个pin的地图，这些pin可以悬停以显示包含pins数据的信息窗口。目前我遇到了一些问题。如果有人能在以下几点上提供帮助，那就太好了：

当我用鼠标删除pin时，信息窗口不会被删除

如何使用在addPin（）中检索的数据来填充 所需信息窗口

在createInfoBox（）中，我想在 地图会被移动，但即使地图没有移动，这似乎也会被触发 搬家

如果有任何改进，我可以让我知道

jsiddle：和下面的JS

JS

var dealerMap = {        

        createInfoBox: function(infobox) {

            var instance = this,
                pushpin = infobox;

            // Now create infowindows
            var NewWindow = new Microsoft.Maps.Infobox(pushpin.getLocation(), {
                title: 'title',
                offset: new Microsoft.Maps.Point(-3, pushpin.getHeight() - 5),
                zIndex: 999,
                visible: true
            });

            //Display infowindow
            instance.displayInfoBox(NewWindow, pushpin);

            //Hide infowindow if map is moved - currently gets run without moving map
            //Microsoft.Maps.Events.addHandler(dealerMap.myMap, 'viewchange', instance.hideInfoBox(NewWindow));

        },

        displayInfoBox: function(infobox, pin) {

            var instance = this;

            //Show updated infowindow
            dealerMap.myMap.entities.push(infobox);

            //Mouse out handler to remove window
            Microsoft.Maps.Events.addHandler(pin, 'mouseleave', function() {        
                instance.hideInfoBox(NewWindow);
            });
        },

        hideInfoBox: function(infobox) {

            var instance = this;

            console.log('this was called');
            dealerMap.myMap.entities.remove(infobox);

        },

        addPin: function() {

            var instance = this;

            //make $.ajax json call            
            var response = data.dummy;

            //on success make each pin with returned data
            for (var i = 0, len = response.length; i < len; i++) {    

                var responseItem = response[i],
                    pinLocation = new Microsoft.Maps.Location(responseItem.lat, responseItem.long);                       

                //Create new pin
                var NewPin = new Microsoft.Maps.Pushpin(pinLocation, {
                    icon: 'http://www.kylehouston.com/testing/sportscar_' + responseItem.id +'.png',
                    width: 32,
                    height: 37
                });    

                //Push new pin onto map
                this.myMap.entities.push(NewPin);          

                //Event handlers to show and hide requested infowindow information
                Microsoft.Maps.Events.addHandler(NewPin, 'mouseover', function(e) {
                    console.log(this);
                    dealerMap.createInfoBox(e.target);
                });
            }                      
        },

        init: function() {

            var instance = this;

            var mapOptions = {
                credentials: "AvGoKWSuMorGQb5h4UyyatCBGmGzSZe7-dWQMzXt4qqz6mV_WCC5m-paxvQhednd",
                center: new Microsoft.Maps.Location(37.09024, -95.712891),
                zoom: 5,
                enableClickableLogo: false,
                enableSearchLogo: false
            }

            dealerMap.myMap = new Microsoft.Maps.Map(document.getElementById('mapDiv'), mapOptions);

            //now add some pins
            instance.addPin();           



        }

    }

    dealerMap.init();


});

var dealerMap={
createInfoBox:函数（infobox）{
var instance=this，
图钉=信息盒；
//现在创建信息窗口
var NewWindow=new Microsoft.Maps.Infobox（pushpin.getLocation（）{
标题：“标题”，
偏移量：新的Microsoft.Maps.Point（-3，图钉.getHeight（）-5），
zIndex:999，
可见：正确
});
//显示信息窗口
displayInfoBox（新窗口、图钉）；
//如果移动地图，则隐藏信息窗口-当前在不移动地图的情况下运行
//Microsoft.Maps.Events.addHandler（dealerMap.myMap，'viewchange'，instance.HideInfo框（NewWindow））；
},
显示信息框：功能（信息框、pin）{
var实例=这个；
//显示更新的信息窗口
dealerMap.myMap.entities.push（infobox）；
//鼠标移出处理程序以删除窗口
Microsoft.Maps.Events.addHandler（pin'mouseleave'，function（）{
instance.hideInfo框（NewWindow）；
});
},
hideInfoBox:函数（信息框）{
var实例=这个；
log（'这被称为'）；
DealMap.myMap.entities.remove（infobox）；
},
addPin:function（）{
var实例=这个；
//进行$.ajaxjson调用
var响应=data.dummy；
//成功后，使用返回的数据创建每个pin
对于（var i=0，len=response.length；i

我强烈建议在地图上一次只显示一个信息框。显示多个信息框会使地图拥挤，并造成糟糕的用户体验。它还占用了更多的资源。更好的方法是创建一个信息框，并在显示内容时对每个图钉重复使用它。我在这里写了一篇博客文章，展示了如何做到这一点：

FYI。。。。。“必应”是一个搜索引擎。“必应地图”是你的问题所在。如果你删除了必应标签，你会有多大帮助