【高德地图入门】--- 解析geojson

简介

GeoJSON是一种用于编码各种地理数据结构的数据。GeoJSON对象可以表示几何、特征或特征集合。GeoJSON支持以下几何类型：点（Point）、线（LineString）、面（Polygon）、多点（MultiPoint）、多线（MultiLineString）、多面（MultiPolygon）和几何集合（GeometryCollection）。GeoJSON中的功能包含几何对象和其他属性，特征集合表示一系列特性。

举例

GeoJson 是有点,线,面组成. 因此高德地图也推出了对应的api,用来解析GeoJson

const geoJSON = {type: "FeatureCollection",features: [{type: "Feature",geometry: { type: "Point", coordinates: [102.0, 0.5] }},{type: "Feature",geometry: {type: "LineString",coordinates: [[102.0, 0.0],[103.0, 1.0],[104.0, 0.0],[105.0, 1.0],]}},{type: "Feature",geometry: {type: "Polygon",coordinates: [[[100.0, 0.0],[101.0, 0.0],[101.0, 1.0],[100.0, 1.0],[100.0, 0.0],]]}},],};

上面的GeoJson 包含了点,线,面。下面看看高德地图是如何解析的呢

      new AMap.GeoJSON({geoJSON: geoJSON,getPolygon: function (geojson, lnglats) {console.log('面',lnglats);},getMarker: function (geojson, lnglats) {console.log('点',lnglats)},getPolyline: function (geojson, lnglats) {console.log('线',lnglats);},});

打印结果：

多点，多面，多线的解析

这里只拿多面举个例子

打印结果

几何集合的解析

打印结果

总结
由上面的例子可以看出，依靠高德的 AMap.GeoJSON 可以对geoJson进行解析
AMap.GeoJSON中有四个属性

AMap.GeoJSON每解析到一个面对象就会触发一次getPolygon对应的函数，如果geoJson对象中有多个面，就会多次触发getPolygon。点，线也是如此。

全部代码展示（其中xxxx 高德的秘钥，cccc是高德的key，需要自己申请）

<!DOCTYPE html>
<html><head><metaname="viewport"content="width=device-width initial-scale=1.0 maximum-scale=1.0 user-scalable=0"/><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>map</title><style>body,html,#container {margin: 0;width: 100%;height: 100%;}</style></head><body><div id="container"></div></body><script>window._AMapSecurityConfig = {securityJsCode: "xxxx",};</script><scriptlanguage="javascript"src="https://webapi.amap.com/maps?v=1.4.15&key=cccc&plugin=AMap.GeoJSON"></script><script language="javascript">const geoJSON = {type: "FeatureCollection",features: [{type: "GeometryCollection",geometries: [{type: "Point",coordinates: [108.62, 31.02819],},{type: "LineString",coordinates: [[108.896484375, 30.107117887],[108.2184375, 30.9171787],[109.5184375, 31.217578],],},],},],};new AMap.GeoJSON({geoJSON: geoJSON,getPolygon: function (geojson, lnglats) {console.log("面", lnglats);},getMarker: function (geojson, lnglats) {console.log("点", lnglats);},getPolyline: function (geojson, lnglats) {console.log("线", lnglats);},});</script>
</html>

【高德地图入门】--- 解析geojson相关推荐

百度高德地图行政区域边界GeoJSON数据获取并绘制行政区域
highcharts 是提供地图数据包的:https://www.highcharts.com/docs/maps/map-collection echart矢量地图或者地图绘制矢量图层,GeoJSO ...
java实现高德地图app,Android 高德地图入门demo，最新高德地图实现方法，附源码及apk...
[实例简介] Android 高德地图入门demo,最新高德地图实现方法,附源码及apk [实例截图] [核心代码] GaoDeDemo ├── GaoDeDemo │ ├── app │ │ ...
html页面调用高德地图,html前端使用高德地图入门教程,并在地图上标记位置-Go语言中文社区...
准备工作注册Key 首先, 登陆之后,在进入「应用管理」页面「创建新应用」为应用添加 Key,「服务平台」一项请选择「 Web 端 ( JSAPI ) 」记住这个Key,等会要用,以后可能也会 ...
html前端使用高德地图入门教程,并在地图上标记位置
准备工作注册Key 首先,注册开发者账号,成为高德开放平台开发者登陆之后,在进入「应用管理」页面「创建新应用」为应用添加 Key,「服务平台」一项请选择「 Web 端 ( JSAPI ) 」 ...
【高德地图入门】--- 绘制面
高德地图内置了许多遮盖物的api,今天主要就是讲解面的绘制方法创建地图为了更好的展示面的绘制,我们需要先创建一个地图对象 <body><div id="containe ...
Android 高德地图入门指南
一.搜索高德开放平台,进行注册.登录和认证,进入到自己的控制台,打开应用管理下的我的应用,点击创建新应用高德地图开放平台的访问地址:https://lbs.amap.com/ 第一步注册开发者用户 ...
【高德地图入门】--- 绘制点
高德地图内置了许多遮盖物的api,今天主要就是讲解常用的点,线,面的绘制方法点的绘制相对简单,只需要一个坐标值即可,例: [ 116.396783,39.894813 ] 创建地图为了更好的展示点 ...
【高德地图入门】--- 绘制线
高德地图内置了许多遮盖物的api,今天主要就是讲解线的绘制方法创建地图为了更好的展示线的绘制,我们需要先创建一个地图对象 <body><div id="containe ...
批量请求高德地图API解析经纬度
使用高德逆地理编码批量请求解析经纬度到具体的位置信息项目中涉及到要根据经纬度解析实际的地理位置,所以就需要搞一把. 纵观出申请一个企业开发者账号,每天的api调用就可以达到300w次了,开心. 个人 ...

【高德地图入门】--- 解析geojson

简介

举例

多点，多面，多线的解析

几何集合的解析

全部代码展示（其中xxxx 高德的秘钥，cccc是高德的key，需要自己申请）

【高德地图入门】--- 解析geojson相关推荐

最新文章

热门文章

【高德地图入门】--- 解析geojson

简介

举例

多点 ，多面，多线 的解析

几何集合的解析

全部代码展示 （其中xxxx 高德的秘钥，cccc是高德的key，需要自己申请）

【高德地图入门】--- 解析geojson相关推荐

最新文章

热门文章

多点，多面，多线的解析

全部代码展示（其中xxxx 高德的秘钥，cccc是高德的key，需要自己申请）