必应地图图钉单击事件处理程序仅适用于最后一个

时间:2018-08-09 04:37:27

标签: javascript c# asp.net-mvc bing-maps pushpin

我从应用程序中生成了以下必应地图-

enter image description here

绿色图钉在红色图钉之后添加到地图。每个图钉都有一个单击处理程序,可打开一个信息框。我的问题是我单击的任何图钉,它只打开绿色图钉的信息框。

这是我的代码-

    var center = new Microsoft.Maps.Location(24.3636, 88.6241);
    var map = new Microsoft.Maps.Map(document.getElementById('myMap'), { center:center, zoom: 7 });

    var color; var description;

    @foreach (var item in Model.MapData)
    {
        <text>

        var location = new Microsoft.Maps.Location(@item.Latitude,@item.Longitude);
        var pushpin = new Microsoft.Maps.Pushpin(location, { color: color });

        map.entities.push(pushpin);

        var infobox = new Microsoft.Maps.Infobox(location, {
            title: '@item.DtwId',
            description: '@item.Desc',
            visible: false 
        });

        Microsoft.Maps.Events.addHandler(pushpin, 'click', function () {
            infobox.setOptions({ visible: true });
        });

        infobox.setMap(map);


        </text>
    }

我在这里想念什么?

1 个答案:

答案 0 :(得分:2)

 var location = new Microsoft.Maps.Location(@item.Latitude,@item.Longitude);
        var pushpin = new Microsoft.Maps.Pushpin(location, { color: color });

        pushpin.metadata = {
           title: '@item.DtwId',
        description: '@item.Desc',
            franchiseNumber: 1
        };

        Microsoft.Maps.Events.addHandler(pushpin, 'click', pushpinClicked);

        map.entities.push(pushpin);


    function pushpinClicked(e) {

        var infobox = new Microsoft.Maps.Infobox(e.target.getLocation(), {
            title: e.target.metadata.title,
            description: e.target.metadata.description,
            visible: true
        });

        infobox.setMap(map);