html标记在天蓝色地图中添加其他属性

我在azure地图中将公司的所有站点作为html标记加载,然后单击它,弹出一个显示站点特定信息的弹出窗口。

HTML标记没有任何属性袋,通过它我可以传递一堆站点信息,这些站点信息可以在我打算在单击html标记时显示的弹出窗口中使用。

有关HtmlMarker的Azure地图文档:https://docs.microsoft.com/en-us/javascript/api/azure-maps-control/atlas.htmlmarkeroptions?view=azure-maps-typescript-latest

有帮助吗?

l264496211 回答:html标记在天蓝色地图中添加其他属性

简单地向html标记添加一个自定义属性,然后向其中添加数据。该数据将始终带有标记。例如:

var popup = new atlas.Popup();

//Create a HTML marker and add it to the map.
var marker = new atlas.HtmlMarker({
    position: [0,0]
});

//Add your custom property with data
marker.properties = { 
    title: 'hello world'
};

map.markers.add(marker);

 map.events.add('click',marker,function(e){   
    //Get the clicked marker.                
    var m = e.target;

    //Get custom properties on the marker
    var p = m.properties;

     popup.setOptions({
        content: `<div style="padding:10px;">${p.title}</div>`,position:m.getOptions().position,pixelOffset: [0,-18]
    });

    //Open the popup.
    popup.open(map);                    
});
本文链接:https://www.f2er.com/2564941.html

大家都在问