layui根据百度地图经纬度在弹出层中显示位置

首先你需要引入百度地图的js

<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=你的ak"></script>

ak,注意是要浏览器端的ak，这个直接到百度开发者平台申请。

引入layui，这个大家可以到layui官网看看怎么引入layer，注意：这里要提示一点content中内容里的div一定要给一个宽高，不然地图是加载不出来的

return layer.open({
          type: 1,
          title: false,
          closeBtn: false,
          area: '500px',
          shade: 0.3,
          shadeClose: true,
          content: '<div id="mapContainer"><div id="tmsbaiduMap" style="height: 500px;width: 500px;"></div></div>',
          success: function(layero, index) {
            var map, marker, myIcon, point;
            //创建百度地图实例
            map = new BMap.Map("tmsbaiduMap");
            //定位的经纬度坐标
            point = new BMap.Point(113.943062, 22.54069);
            //将地图中心移动到我们指定的地点,并设置地图等级（就是地图缩放的程度）
            map.centerAndZoom(point, 20);
            //导入位置图标,后面设置的size的参数其实是一个矩形,25和23是宽和高,如果发现自定义的图标只有一部分,那就适量加大一些这2个参数
            myIcon = new BMap.Icon("images/ots/location.png", new BMap.Size(25, 23));
            marker = new BMap.Marker(point, {
              icon: myIcon
            });
            //在我们指定的地点显示位置图标
            map.addOverlay(marker);
            //鼠标滚轮可以缩放地图
            return map.enableScrollWheelZoom(true);
          }
        });

本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益，请联系我们，我们会在确认后第一时间进行删除！

layui根据百度地图经纬度在弹出层中显示位置

相关文档推荐