百度高德地图行政区域边界GeoJSON数据获取并绘制行政区域
highcharts 是提供地图数据包的:https://www.highcharts.com/docs/maps/map-collection
echart矢量地图或者地图绘制矢量图层,GeoJSON哪里提供呢?
dataV提供数据下载,http://datav.aliyun.com/tools/atlas/#&lat=30.332329214580188&lng=106.75386074913891&zoom=4.5
这些数据也是从高德上面来的,翻了下高德地图的api,其实可以直接获取
高德地图获取地图边界数据
区域查询获取边界数据
行政区域查询官方文档:https://lbs.amap.com/api/webservice/guide/api/district
restapi.amap.com/v3/config/district?key=您的key&keywords=山东&subdistrict=2&extensions=all
返回的polyline为坐标边界数据,用;分隔点坐标数组,在用,分隔出坐标数组即可。
AMap.DistrictSearch插件查询
https://lbs.amap.com/api/javascript-api/reference/search#m_AMap.PlaceSearch
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
https://lbs.amap.com/api/javascript-api/example/district-search/draw-district-boundaries
https://lbs.amap.com/api/javascript-api/example/line/obj3d-thinline
获取的数据,需要自己转GeoJSON数据,插件https://www.npmjs.com/package/geojson
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(行政区划浏览)官方文档:https://lbs.amap.com/api/javascript-api/reference-amap-ui/geo/district-explorer
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数据获取并绘制行政区域》,
请注明出处:https://www.zhoulujun.cn/html/GIS/WebGIS/8155.html
百度高德地图行政区域边界GeoJSON数据获取并绘制行政区域的更多相关文章
- 百度&高德地图小区景点边界轮廓实现
经常的我们在使用地图功能时,会发现在选择一个小区或者一个热门景点的时候,地图上面会给出其边界轮廓,能够方便我们知道其范围大小,有时候在我们使用地图组件的时候,也会面临着类似的需求.比如在地图上面标识出 ...
- 从高德采集最新的省市区三级坐标和行政区域边界,用js在浏览器中运行
本文描述的是对国家统计局于2019-01-31发布的<2018年统计用区划代码和城乡划分代码(截止2018年10月31日)>中省市区三级的坐标和行政区域边界的采集. 本文更新(移步查阅): ...
- 百度地图API和高德地图API资料集锦
[高德地图API]从零开始学高德JS API(五)路线规划——驾车|公交|步行 [高德地图API]从零开始学高德JS API(四)搜索服务——POI搜索|自动完成|输入提示|行政区域|交叉路口|自 ...
- leaflet中如何优雅的解决百度、高德地图的偏移问题
话不多说,先上效果图 以前在做项目时,经常会听到客户说,你们这个地图是哪来的,太丑了,能不能换成百度地图--高德也行-- 大家生活中,基本上都已经习惯了使用百度地图和高德地图,而在做项目时,用这两个地 ...
- GPS定位为什么要转换处理?高德地图和百度地图坐标处理有什么不一样?
GPS定位为什么要转换处理?高德地图和百度地图坐标处理有什么不一样? 先了解一下 高德地图 采用: GCJ-02 (不可逆) 百度百科: http://baike.baidu.com/link?url ...
- iOS打开百度地图、高德地图导航
1.判断手机里是否已经安装了百度地图或者高德地图: BOOL hasBaiduMap = NO; BOOL hasGaodeMap = NO; if ([[UIApplication sharedAp ...
- Android笔记:百度地图与高德地图坐标转换问题
安卓项目使用了百度地图的定位SDK,web端使用的也是百度地图, 后来发现界面显示百度地图不如高德效果好,web改用高德地图,原本的百度地图坐标是可以直接使用的,由于高德和百度地图的坐标系不一致 要如 ...
- iOS 地图坐标系之间的转换WGS-84世界标准坐标、GCJ-02中国国测局(火星坐标,高德地图)、BD-09百度坐标系转换
开发过程中遇到地图定位不准确,存在偏差.首先确认你获取到的坐标所在坐标系跟地图数据是不是相匹配的. 常用的地图SDK:高德地图使用的是GCJ-02(也就是火星坐标系),百度使用的是BD-09百度坐标系 ...
- iOS判断并使用百度地图 高德地图 导航 (使用URI,不集成sdk)
[objc] view plaincopy 1. BOOL hasBaiduMap = NO; 2. BOOL hasGaodeMap = NO; 3. ...
- Windows Store Javascript项目使用高德地图、谷歌地图、百度地图API
原文 Windows Store Javascript项目使用高德地图.谷歌地图.百度地图API 在Win8 Store 项目中可以使用的地图主要有微软的Bing Map,目前高德地图sdk也支持Wi ...
随机推荐
- ElectronReactAdmin跨平台管理系统|electron27+react18后台模板EXE
基于electron27+react18+arco电脑端后台管理程序EXE实例ElectronRAdmin. electron27-react18-admin 基于跨平台技术Electron集成Vit ...
- 网页全终端h5浏览器视频流解决方案RTSP/FLV/HLS
背景 项目上需要基于视频巡检,在线勘查填写定制表单,降低巡检成本. 本文着重讲前端部分视频流展示解决方案. 调研 流媒体(streaming media)是指将一连串的媒体数据压缩后,经过网上分段发送 ...
- 自定义xunit测试用例的执行顺序
有的时候我们会对程序进行单元测试, 为了测试的效果以及后期的维护, 我一般会将各个测试拆开, 根据需要测试的类分到各个类型中, 不过在实际操作的时候就出现了一些意想不到的问题, 各个测试的执行是乱序的 ...
- Kepware楼宇自控BACnet/IP驱动
BACnet/IP驱动是楼宇自动化设备驱动的集合,为用户提供一种方便快捷的楼宇自动化设备数采解决方案.只需要通过简单的配置就可以将常见的BACnet/IP协议设备无缝连接到 HMI/SCADA.MES ...
- 解锁 ElasticJob 云原生实践的难题
发生了什么 最近在逛 ElasticJob 官方社区时发现很多小伙伴都在头疼这个 ElasticJob 上云的问题,ElasticJob 本就号称分布式弹性任务调度框架,怎么在云原生环境就有了问题了呢 ...
- 初探webpack之单应用多端构建
初探webpack之单应用多端构建 在现代化前端开发中,我们可以借助构建工具来简化很多工作,单应用多端构建就是其中应用比较广泛的方案,webpack中提供了loader与plugin来给予开发者非常大 ...
- Codeforces Round 909 (Div3)(本菜鸟只补到了E)
Codeforces Round 909 (Div.3) A. Game with Integers 水题,就是可以被3整除的输出"Second",不能被3整除的输出"F ...
- 有什么BI工具可以实现中国式报表?
BI(Business Intelligence)工具是指用于帮助企业收集.分析.处理和展示数据的软件工具,以支持企业决策制定和业务运营优化的技术系统. 中国式报表在BI工具中的实现主要涉及到对中国商 ...
- NLP项目实战02:英文文本识别
简介: 欢迎来到本篇文章!今天我们将讨论一个新的自然语言处理任务--英文短文识别.具体而言,即通过分析输入的英文文本来判断其是比较消极的还是比较积极的. 展示: 1.项目界面 如下所示是项目启动后用户 ...
- 开发期间flask运行方式(1.x和2.x区别)
1.x使用app.run(参数) 可以使用debug=True控制处于什么模式. app.run(host="127.0.0.1", port=5000, debug=True) ...