• 首页 首页 icon
  • 工具库 工具库 icon
    • IP查询 IP查询 icon
  • 内容库 内容库 icon
    • 快讯库 快讯库 icon
    • 精品库 精品库 icon
    • 问答库 问答库 icon
  • 更多 更多 icon
    • 服务条款 服务条款 icon

高德地图笔记

武飞扬头像
小全upup
帮助1

####地图生命周期
地图对象生命周期分为三个部分:创建,存在和销毁

创建 new AMap.mao('xx')
创建经常使用的参数
zoom 设置地图显示的缩放级别
center 设置地图中心点坐标
layers 设置图层 可设置成一个包含多个图层的数组
mapStyle 设置地图的显示样式
viewMode 设置地图的模式

地图加载完成后触发complete事件
map.on('complete’,function(){})

调用destory方法来销毁地图。该方法执行后,地图对象被注销,内存释放,地图容器被清空

####覆盖物的添加 获取 移除方法 
add getAllOverlays(type)方法获取已经添加的覆盖物 
remove方法移除覆盖物,参数可以为单个覆盖物对象,也可以是一个包括多个覆盖物的数组
clearMap()用来删除所有的覆盖物

####添加设置获取移除图层
add方法可以用来添加各类型的图层
setLayers方法设置图层 使用该方法以后,地图图层会被重置
getLayers方法获取地图图层数据
remove方法移除地图图层

####设置地图底图的样式
配置项 mapStyle:'amap://styles/whitesmoke'
标准 normal
马卡龙 macaron
涂鸦 graffiti
远山黛 whitesmoke
幻影黑 dark
草色青 fresh
极夜蓝 darkblue
月光银 light
雅士灰 grey

####覆盖物 
点标记 Marker
灵活点标记 ElasticMarker
圆形标记 CircleMarker
文本标记 Text

海量标注 LabelMarker
LabelsLayer图层是承载LabelMarker的图层,
所有创建的LabelMarker需要添加到LabelMarker图层是哪个才能最终展示到地图之上


海量点标记 MassMarks
点聚合 MarkerCluster


####矢量图形覆盖物
折线覆盖物 Polyline 
多边形覆盖物 Polygon
圆形覆盖物 Circle
矩形覆盖物 Rectangle
椭圆形覆盖物 Elipse
贝塞尔曲线 BesizerCurve

添加 add
移除remove
显示 show
隐藏 hide

####覆盖物群组

覆盖物集合 OverlayGroup
当用户需要对一组覆盖物集合做整体操作是,可以使用AMap.OverlayGroup
类创建的实例对象来操作,以避免通过循环来一个个设置属性

步骤
创建覆盖物
创建覆盖物群组,传入覆盖物组成的数组
对此覆盖物群组设置同一属性
统一添加到地图实例上
统一的显示show()
统一的隐藏 hide()
添加新的覆盖物到群组 addOverlay(xxx)
移除群组中的一个覆盖物 removeOverlay(XXX) 加个s可以传数组删除多个
返回当前集合中所有的覆盖物 getOverlays()
判断传入的覆盖物实例是否在集合中 hasOverlays(XX)
清空集合 clearOverlays
eachOverlay(iterator) 迭代操作
修改覆盖物属性(包括线样式,样色等等)

GeoJSON类 GeoJSON
继承自OverLayGroup,也是对一组覆盖物群组进行操作的类。

####编辑矢量图形
除了可以在地图上添加点,线,面等多种覆盖物以外,还可以使用一系列地图工具进行编辑

鼠标工具MouseTool
插件主要通过用户在地图图面的鼠标操作,绘制相应的点,线,面覆盖物;或者进行图面的距离测量,面积量测。
拉框放大,拉框缩小等
点覆盖物 marker
多边形 polygon
鼠标工具距离量测,面积量测 拉框放大 rule

####地图控件
地图基础控件包括工具条,比例尺,定位,鹰眼,基本图层切换等常用的控件 测试失败

####信息窗体和右键菜单
信息窗体infoWindow
同一地图实例每次只能打开一个信息窗体
右键菜单

####高德地图官方图层
标准图层TileLayer
卫星图层 TileLayer.Satellite
路网图层TileLayer.RoadNet
实时交通图层TileLayer.Traffic
楼块图层Buildings
室内地图IndoorMap

####简易行政区地图
世界简易行政区图层AMap.DistrictLayer.World
国家简易行政区图层AMap.DistrictLayer.Country
省市简易性质区图层AMap.DistrictLayer.Provice

####第三方标准图层
WMS标准图层
WMTS标准图层
非高德官方的栅格图片

####使用自有数据添加图层
图片图层ImageLayer
将静态图片作为图层添加在地图上,图片图层会随着缩放级别而自适应缩放

Canvas图层CanvasLayer 
将Canvas作为图层添加在地图上。Canvas图层会随着缩放级别而自适应缩放

灵活切片层TileLayer.Flexible


####自定义图层
是完全由开发者指定绘制的图层。该图层可以是canvas,svg,甚至可以是dom组成的图层。
JSAPI能够实现自定义图层与高德地图同步平移和缩放
并调用开发者的render方法进行图层的重绘。
自定义图层使用AMap.CustomLayer类来进行构造,构造函数接收两个参数
第一参数是作为图层的dom画布,第二个参数是图层相关的属性设定,与通用图层属性相同
为自定义图层添加渲染方法自定义图层的render方法即用户自定义的图层绘制方式
API在图层初次绘制
地图移动与缩放结束时


####地图和覆盖物事件
事件绑定及解绑
和大多数类库使用相同的方式,直接用map,覆盖对象的on,off方法

MapsEvent对象
对于Map,覆盖物,叠加层对象的鼠标,触屏事件的回调时,会返回MapsEvent对象。
该对象包含触发的对象目标,触发所在的经纬度等信息

地图事件
地图加载完成 complete
地图缩放等级改变 zoomstart zoomend
地图中心点移动 mapmove,movestart,moveend
地图容器尺寸改变 resize
鼠标事件
click dbclick mousemove mouSEO((Search Engine Optimization))ver mosuSEO((Search Engine Optimization))ut mouseup mousedown mousewheel rightclick
触屏点击 touchstart touchmove touchend

覆盖物事件
覆盖是指叠加在地图底图上的一些常见要素,比如点标记,图标标记,文本标记,线类型标记
面类型标记。都属于覆盖物。

覆盖物状态改变时触发 
Marker,Text类对象发生移动 事件名称 moving moveend movealong
矢量图形显示,隐藏 hide show
ContextMenu类对象打开和关闭 open close

鼠标,触屏等进行交互时触发
同上

####坐标系转换
地图容器坐标与经纬度的互换
容器坐标转经纬度坐标map.containerToLnglat
经纬度坐标转容器坐标map.IngLatToContainer

经纬度与平面地图像素坐标转换
经纬度转换平面地图像素坐标map.InglatToPixel
平面地图像素坐标map.pixelTolngLat

####其他坐标转高德坐标
地球坐标系 WGS84:常见于GPS设备,Google地图等国际标准的坐标体系
火星坐标系 GCJ-02 中国国内使用的被强制加密后的坐标体系,高德坐标体系就属于改坐标体系
百度坐标体系 BD-09 百度地图所使用的坐标体系,是在火星坐标体系的基础上又进行了一次加密处理
因此在使用不同的坐标系之前,我们需要使用AMap.convertForm()方法将这些非高德坐标系进行转换


####距离,长度 面积
计算两点间的距离 AMap.GeometryUtil.distance
计算点到线段的最短距离 AMap.GeometryUtil.distanceToSegment
计算点到路径的最短距离 AMap.GeometryUtil.distanceToLine
计算路径的实际长度 AMap.GeometryUtil.distanceOfLine
计算封闭区域的面积 AMap.GeometryUtil.ringArea

####计算线面关系
判断点是否在面内 AMap.GeometryUtil.isPointInRing
判断点是否在线段上 AMap.GeometryUtil.isPointOnSegment
计算两个经纬度面的交叉区域 AMap.GeometryUtil.ringRingClip
 

这篇好文章是转载于:学新通技术网

  • 版权申明: 本站部分内容来自互联网,仅供学习及演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,请提供相关证据及您的身份证明,我们将在收到邮件后48小时内删除。
  • 本站站名: 学新通技术网
  • 本文地址: /boutique/detail/tanhghfgii
系列文章
更多 icon
同类精品
更多 icon
继续加载