百度地图给多个点添加信息窗口点击事件

最新推荐文章于 2022-11-09 16:11:28 发布

小星落

最新推荐文章于 2022-11-09 16:11:28 发布

阅读量2.7k

点赞数

分类专栏： javascript 文章标签： BMapGL 地图标记点信息窗口 JavaScript

本文链接：https://blog.csdn.net/qq_46380656/article/details/112313103

版权

javascript 专栏收录该内容

52 篇文章

订阅专栏

<body>
    <div id="container"></div>
</body>

var map = new BMapGL.Map('container');
    map.centerAndZoom(new BMapGL.Point(116.404, 39.928), 15);
    map.enableScrollWheelZoom(true);
    var pp = [{ lng: 116.404, lat: 39.925 }, { lng: 116.404, lat: 39.915 }, { lng: 116.395, lat: 39.935 }, { lng: 116.415, lat: 39.931 }]
    // 创建点标记
    var opts = {
        width: 250,     // 信息窗口宽度
        height: 80,     // 信息窗口高度
	    title : "故宫博物院" , // 信息窗口标题
	    message:"这里是故宫"
    };
    for (var a = 0; a < pp.length; a++) {
        var P = new BMapGL.Point(pp[a].lng, pp[a].lat)
        var MP = new BMapGL.Marker(P);
        map.addOverlay(MP);
        var content = "地址：北京市东城区王府井大街" + a
        addClickHandler(content, MP, P);
    }
    function addClickHandler(content, marker, p) {
        marker.addEventListener("click", function (e) {
            var infoWindow = new BMapGL.InfoWindow(content, opts);  // 创建信息窗口对象 
            map.openInfoWindow(infoWindow, p); //开启信息窗口
        }
        );
    }