百度高德地图行政区域边界GeoJSON数据获取并绘制行政区域 |
您所在的位置:网站首页 › vue百度地图定位demo › 百度高德地图行政区域边界GeoJSON数据获取并绘制行政区域 |
highcharts 是提供地图数据包的:www.highcharts.com/docs/maps/m… echart矢量地图或者地图绘制矢量图层,GeoJSON哪里提供呢? dataV提供数据下载,datav.aliyun.com/tools/atlas… 这些数据也是从高德上面来的,翻了下高德地图的api,其实可以直接获取 高德地图获取地图边界数据 区域查询获取边界数据行政区域查询官方文档:lbs.amap.com/api/webserv… restapi.amap.com/v3/config/district?key=您的key&keywords=山东&subdistrict=2&extensions=all 返回的polyline为坐标边界数据,用;分隔点坐标数组,在用,分隔出坐标数组即可。 AMap.DistrictSearch插件查询lbs.amap.com/api/javascr… let opts = { // 设置显示下级行政区级数 可选值:0、1、2、3等数字 subdistrict: 2, // base:不返回行政区边界坐标点;all:只返回当前查询district的边界值,不返回子节点的边界值;目前不能返回乡镇/街道级别的边界值 extensions: 'all', level: data.level } var district = new AMap.DistrictSearch(opts); district.search('河北省', function (status, result) {result.districtList[0].boundaries}) 官方demo lbs.amap.com/api/javascr… lbs.amap.com/api/javascr… 获取的数据,需要自己转GeoJSON数据,插件www.npmjs.com/package/geo… var GeoJSON = require('geojson') var data = [{name: 'Location A', category: 'Store', street: 'Market', lat: 39.984, lng: -75.343}] var data2 = { name: 'Location A', category: 'Store', street: 'Market', lat: 39.984, lng: -75.343 } GeoJSON.parse(data, {Point: ['lat', 'lng']}) GeoJSON.parse(data2, {Point: ['lat', 'lng'], include: ['name']}) var data3 = [ { x: 0.5, y: 102.0, prop0: 'value0' }, { line: [[102.0, 0.0], [103.0, 1.0], [104.0, 0.0], [105.0, 1.0]], prop0: 'value0', prop1: 0.0 }, { polygon: [ [ [100.0, 0.0], [101.0, 0.0], [101.0, 1.0], [100.0, 1.0], [100.0, 0.0] ] ], prop0: 'value0', prop1: {"this": "that"} } ] GeoJSON.parse(data3, {'Point': ['x', 'y'], 'LineString': 'line', 'Polygon': 'polygon'}); 复制代码推荐阅读《GIS坐标系:WGS84,GCJ02,BD09,火星坐标,大地坐标等解析说与转换》 此方法只能获取当前行政区域边界,无法获取子区域边界。 行政区划浏览获取边界数据DistrictExplorer(行政区划浏览)官方文档:lbs.amap.com/api/javascr… Feature直接取自GeoJSON。AreaNode之中无论父级区划(ParentFeature)还是子级区划(SubFeature),都可以获取地图坐标边界数据,但是 parentFeature 不是标准GeoJSON格式,需要自己转换。 //创建一个实例 var districtExplorer = new DistrictExplorer({ map: map //关联的地图实例 }) var adcode = 100000 //全国的区划编码 districtExplorer.loadAreaNode(adcode, function (error, areaNode) { if (error) { console.error(error) areaNode.Feature return } //Feature直接取自GeoJSON var subFeatures = areaNode.getSubFeatures() var parentFeature = areaNode.getParentFeature() }) 复制代码方法很简单。 百度地图获取行政区域边界通过BMap.Boundary(),获取地图边界数据。 var bdary = new BMap.Boundary(); bdary.get(name, function(rs){rs.boundaries}) var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.403765, 39.914850), 5); map.addControl(new BMap.NavigationControl({type: BMAP_NAVIGATION_CONTROL_SMALL})); map.enableScrollWheelZoom(); function getBoundary(){ var bdary = new BMap.Boundary(); var name = document.getElementById("districtName").value; bdary.get(name, function(rs){ //获取行政区域 map.clearOverlays(); //清除地图覆盖物 var count = rs.boundaries.length; //行政区域的点有多少个 for(var i = 0; i < count; i++){ var ply = new BMap.Polygon(rs.boundaries[i], {strokeWeight: 2, strokeColor: "#ff0000"}); //建立多边形覆盖物 console.log(rs.boundaries) map.addOverlay(ply); //添加覆盖物 map.setViewport(ply.getPath()); //调整视野 } }); } 复制代码百度地图的数据是 火星坐标 再加密的,个人不推荐使用百度地图上的数据获取到的经纬度。 转载本站文章《百度高德地图行政区域边界GeoJSON数据获取并绘制行政区域》, 请注明出处:www.zhoulujun.cn/html/GIS/We… |
今日新闻 |
推荐新闻 |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |