首页使用百度地图最新API加载geojson实现覆盖物，样例代码

使用百度地图最新API加载geojson实现覆盖物，样例代码

时间: 2023-12-29 20:02:59 浏览: 278

以下是使用百度地图最新API加载geojson实现覆盖物的样例代码： ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>使用百度地图最新API加载geojson实现覆盖物</title> <style type="text/css"> #map{ height: 500px; } </style> <script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=YourKey"></script> </head> <body> <div id="map"></div> <script type="text/javascript"> // 创建地图实例 var map = new BMap.Map("map"); // 设置中心点和缩放级别 var point = new BMap.Point(116.404, 39.915); map.centerAndZoom(point, 14); // 加载geojson数据 var url = "path/to/your/geojson"; var request = new XMLHttpRequest(); request.open('GET', url, true); request.send(null); request.onreadystatechange = function () { if (request.readyState === 4 && request.status === 200) { var geojson = JSON.parse(request.responseText); // 定义样式函数 function getStyle(feature) { return { strokeColor: "#000000", strokeWeight: 2, fillColor: "#FF0000", fillOpacity: 0.5 }; } // 创建GeoJSON图层并添加到地图中 var geojsonLayer = new BMapGL.GeoJSONLayer({ data: geojson, style: getStyle }); map.addOverlay(geojsonLayer); } }; </script> </body> </html> ``` 其中，`YourKey`需要替换成你的百度地图API密钥，`path/to/your/geojson`需要替换成你的geojson文件路径。在样例代码中，我们使用`XMLHttpRequest`对象加载geojson数据，并创建`BMapGL.GeoJSONLayer`对象将数据添加到地图中，并定义了样式函数`getStyle`来设置覆盖物的样式。

阅读全文