Question

我从以下示例开始： https://code.msdn.microsoft.com/bing/Using-the-Bing-Maps-V8-Web-07e21f3a#content

基本上提供带有搜索选项的表单，然后将搜索结果显示为html文件。

现在，我正在尝试向html文件添加项目数组，而不是一个，以显示这些内容。但我似乎无法理解如何通过单击按钮获取html文件以从Form1.cs文件捕获地址列表。

我已将其添加到表单中：

    private void GroupBtn_Click(object sender, EventArgs e)
    {
        var pushpinInfos = new[] {
            new { lat = 41.80584, lng = 21.15498, title = "Salmon Market", description = "<a href=\"http://www.google.com\">Kipper</a> Gostivar", icon = "http://icons.iconarchive.com/icons/icons-land/vista-map-markers/24/Map-Marker-Marker-Inside-Chartreuse-icon.png" },
            new { lat = 42.000900, lng = 21.466440, title = "Market", description = "Gostivar", icon = "https://i-msdn.sec.s-msft.com/dynimg/IC488534.jpeg" }
        };

        MyWebBrowser.Document.InvokeScript("SetMap", new object[] { pushpinInfos });
    }

这是html文件：

    function SetMap(addresses) {
    //Create an infobox at the center of the map but don't show it.
    infobox = new Microsoft.Maps.Infobox(map.getCenter(), {
        visible: false
    });

    //Assign the infobox to a map instance.
    infobox.setMap(map);

    pinLayer = new Microsoft.Maps.EntityCollection();
    map.entities.push(pinLayer);

    var pins1 = JSON.stringify(addresses);

    // alert(pins1);

    $.each(JSON.parse(pins1), function (key, pinJson) {


        var position = new Microsoft.Maps.Location(pinJson.lat, pinJson.lng);
        // Creates a Pushpin
        var pin = new Microsoft.Maps.Pushpin(position, { text: pinJson.Title, icon: 'images/map_pin_13.png', typeName: 'sampleCustom' });
        //Store some metadata with the pushpin.
        pin.metadata = {
            title: 'Pin',
            description: 'Discription for pin'
        };
        //Add a click event handler to the pushpin.
        Microsoft.Maps.Events.addHandler(pin, 'click', pushpinClicked);
        //Add pushpin to the map.
        map.entities.push(pin);
        pinLayer.push(pin);
    });
}

但是它不起作用，而且我似乎无法调试html表单。

所以我的问题是：

1）没有办法调试html部分吗？

2）尝试在地图上显示2个地址的地方出了错？

Answer 1

代码中的几个问题：

您创建了一个图钉层，但是将图钉直接添加到地图和图层中。这会引起问题。
您的pin层正在使用不推荐使用的EntityCollection类和map.entities。使用map.layers和Microsoft.Maps.Layer
图钉没有typeName选项。这是旧地图控件中的一项功能，由于在不支持CSS样式的HMTL5画布上进行渲染，因此在最新版本中不可用。
较小的东西，但是在使用图层时，向其添加事件而不是单个形状，会提高性能。

这是您代码的修改版本：

function SetMap(addresses) {
    //Create an infobox at the center of the map but don't show it.
    infobox = new Microsoft.Maps.Infobox(map.getCenter(), {
        visible: false
    });

    //Assign the infobox to a map instance.
    infobox.setMap(map);

    pinLayer = new Microsoft.Maps.Layer();
    map.layers.insert(pinLayer);

    //Add a click event handler to the pin layer.
    Microsoft.Maps.Events.addHandler(pinLayer, 'click', pushpinClicked);

    var pins1 = JSON.stringify(addresses);

    // alert(pins1);

    $.each(JSON.parse(pins1), function (key, pinJson) {


        var position = new Microsoft.Maps.Location(pinJson.lat, pinJson.lng);
        // Creates a Pushpin
        var pin = new Microsoft.Maps.Pushpin(position, { text: pinJson.Title, icon: 'images/map_pin_13.png', typeName: 'sampleCustom' });
        //Store some metadata with the pushpin.
        pin.metadata = {
            title: 'Pin',
            description: 'Discription for pin'
        };

        //Add pushpin to the map.
        pinLayer.add(pin);
    });
}

将多个自定义标记添加到Bing Maps（API）示例

1 个答案: