首页使用bmap，通过地图json绘制线，给我个demo

使用bmap，通过地图json绘制线，给我个demo

时间: 2023-06-11 14:10:03 浏览: 158

好的，这里是一个使用bmap绘制线的示例代码： ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>使用bmap绘制线</title> <style type="text/css"> #map { height: 400px; width: 100%; margin: 0; padding: 0; } </style> </head> <body> <div id="map"></div> <script src="http://api.map.baidu.com/api?v=2.0&ak=你的密钥"></script> <script type="text/javascript"> // 初始化地图 var map = new BMap.Map("map"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 11); // 中心点和缩放级别 // 定义坐标数组 var points = [ new BMap.Point(116.387112, 39.920977), new BMap.Point(116.408352, 39.923187), new BMap.Point(116.415451, 39.907578) ]; // 创建线路覆盖物 var polyline = new BMap.Polyline(points, { strokeColor: "blue", // 线条颜色 strokeWeight: 6, // 线条宽度 strokeOpacity: 0.5 // 线条透明度 }); // 添加线路覆盖物到地图上 map.addOverlay(polyline); </script> </body> </html> ``` 在这个示例代码中，我们首先通过BMap.Map()构造函数创建了一个地图实例，并指定了地图的中心点和缩放级别。然后，我们定义了一个坐标数组，其中包含了三个点的经纬度信息。接着，我们使用BMap.Polyline()构造函数创建了一个线路覆盖物，并设置了线条的颜色、宽度和透明度等属性。最后，我们将该线路覆盖物添加到地图上，即可显示出绘制的线路。需要注意的是，上述代码中的“你的密钥”需要替换成你自己的百度地图开发者密钥。

阅读全文