Map
继承Evented。
示例
var map = new wmapgl.Map ({
container : 'map',
center : [116.45, 39.9],
zoom : 13,
style : style_object
});
构造函数
new Map (options : Object)
构造选项
| 选项名 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| container | (HTMLElement | string) | 指定地图所在的容器DOM， 也可指定DOM的ID。 该DOM不能有子元素。 | |
| minZoom | number | 0 | 地图最小缩放级别（0-24） |
| maxZoom | numbe | 22 | 地图最大缩放级别（0-24） |
| style | (Object | string) | 地图配置样式 | |
| pitchWithRotate | boolean | true | 如果为false，地图的俯仰(倾斜)控制与“拖动旋转”交互将被禁用。 |
| maxBounds | LngLatBoundsLike | 如果设置，地图将被现在在给定的边界 | |
| scrollZoom | (boolean | Object) | true | 为true，开启滚动缩放地图模式。 |
| boxZoom | boolean | true | 如果为true，启用拉框缩放模式 |
| dragRotate | boolean | true | 如果为true，启用拖拽旋转模式 |
| dragPan | boolean | true | 为true，启用拖拽平移模式 |
| keyboard | boolean | true | 为true，启用键盘快捷键模式 |
| doubleClickZoom | boolean | true | 为true，启用双击缩放地图模式 |
| touchZoomRotate | boolean | true | 为true，启用捏合旋转、缩放地图模式 |
| center | LngLatLike | [0,0] | 地图初始中心点 |
| zoom | number | 0 | 地图初始级别 |
| bearing | number | 0 | 地图初始旋转角度 |
| pitch | number | 0 | 地图初始倾斜角度 |
| bounds | LngLatBoundsLike? | 地图初始范围，如果指定该值，会覆盖center和zoom属性 |
方法
地图基本方法
| 方法 | 返回值 | 描述 |
|---|---|---|
| addControl (control : IControl,position : string?) | this | 添加控件。位置可取'top-left' , 'top-right' , 'bottom-left'， 'bottom-right'。默认为 'top-right' 。 |
| removeControl (control : IControl) | this | 移除控件 |
| resize (eventData : Object) | this | 根据地图容器调整地图大小 |
| panBy (offset : PointLike,options : AnimationOptions,eventData : Object) | this | 安偏移量移动地图 |
| panTo (lnglat : LngLatLike,options : AnimationOptions,eventData : Object) | this | 移动到地图指定位置 |
| jumpTo (options : Object,eventData : Object) | this | 改变中心、级别、方位和俯仰的任何组合，没有动画过度 |
| flyTo (options : Object,eventData : Object) | this | 改变中心、级别、方位和俯仰的任何组合，使过渡沿曲线运动，从而唤起飞行。 |
| zoomTo (zoom : number,options : AnimationOptions,eventData : Object) | this | 绽放到指定级别 |
| zoomIn (options : AnimationOptions,eventData : Object) | this | 放大一级 |
| zoomOut (options : AnimationOptions,eventData : Object) | this | 缩小一级 |
| rotateTo (bearing : number,options : AnimationOptions,eventData : Object) | this | 使用动画转换将地图旋转到指定的方位。 |
| stop () | this | 停止所有动画过渡 |
地图属性获取和设置方法
| 方法 | 返回值 | 描述 |
|---|---|---|
| getBounds () | LngLatBounds | 获取当前地图的范围 |
| getMaxBounds () | (LngLatBounds | null) | 获取地图最大范围 |
| setMaxBounds (bounds : (LngLatBoundsLike | null) | this | 设置地图最大范围 |
| getZoom () | number | 获取地图级别 |
| setZoom (zoom : number,eventData : Object) | this | 指定级别 |
| getMinZoom () | number | 获取地图最小级别 |
| setMinZoom (zoom : number) | this | 设置地图最小级别 |
| getMaxZoom () | number | 获取地图最大级别 |
| setMaxZoom (zoom : number) | this | 设置地图最大级别 |
| getCenter () | LngLat | 获取中心点 |
| setCenter (center : LngLatLike,eventData : Object) | this | 设置中心点 |
| getBearing () | number | 获取地图方位 |
| setBearing (bearing : number,eventData : Object) | this | 设置地图方位 |
| getPitch () | number | 获取地图俯仰(倾斜) |
| setPitch (pitch : number,eventData : Object) | this | 设置地图俯仰(倾斜) |
| isMoving () | boolean | 当前地图是否在移动 |
| isZooming () | boolean | 当前地图是否在缩放 |
| isRotating () | boolean | 当前地图是否在旋转 |
| getContainer () | HTMLElement | 获取容器 |
| loaded () | boolean | 地图加载完成 |
| remove () | 清理并释放与此地图关联的所有内部资源。 |
事件方法
| 方法 | 返回值 | 描述 |
|---|---|---|
| on (type : string,layerId : string,listener : Function) | this | 添加特定图层的事件，目前的事件类型有'mousedown' , 'mouseup' , 'click' , 'dblclick' , 'mousemove' , 'mouseenter' , 'mouseleave' , 'mouseover' , 'mouseout' , 'contextmenu' , 'touchstart' , 'touchend' , 'touchcancel' |
| on (type : string,listener : Function) | this | 添加地图事件 |
| off (type : string,layerId : string,listener : Function) | this | 移除特定图层的事件 |
| off (type : string,listener : Function) | this | 移除Map#on添加的事件 |
样式方法
| 方法 | 返回值 | 描述 |
|---|---|---|
| setStyle (style,options : Option) | 设置地图样式 | |
| getStyle () | Object | 获取地图样式 |
| isStyleLoaded () | boolean | 样式是否加载完成 |
数据源方法
| 方法 | 返回值 | 描述 |
|---|---|---|
| addSource (id : string,source : Object) | this | 添加数据源 |
| isSourceLoaded (id : string) | boolean | 数据源加载完成 |
| removeSource (id : string) | this | 移除数据源 |
| getSource (id : string) | Object | 获取数据源 |
图片方法
| 方法 | 返回值 | 描述 |
|---|---|---|
| addImage (id : string,image,options : any) | 添加图片 | |
| updateImage (id : string,image) | 更新图片 | |
| hasImage (id : string) | boolean | 图片是否添加到地图 |
| removeImage (id : string) | 从地图移除图片 | |
| loadImage (url : string,callback : Function (error,data) | 加载图片 | |
| listImages () | string[] | 加载到地图的所以图片列表 |
图层方法
| 方法 | 返回值 | 描述 |
|---|---|---|
| addLayer (layer : Layers,beforeId : string?) | this | 添加图层,beforeId是插入新图层前面的现有图层ID。 如果该参数被省略，该图层将会被添加到图层数组的末尾。 |
| moveLayer (id : string,beforeId : string?) | this | 移动图层 |
| removeLayer (id : string) | 移除图层 | |
| getLayer (id : string) | Object | 获取图层 |
| setLayerZoomRange (layerId : string,minZoom : number,maxZoom : number) | this | 设置指定层的缩放级别范围 |
| setFilter (layerId : string,filter : (Array | null),options : Object?) | this | 设置过滤条件 |
| getFilter (layerId : string) | Array | 获取过滤条件 |
| setPaintProperty (layerId : string,name : string,value : any,options : Object?) | this | 设置绘制属性 |
| getPaintProperty (layerId : string,name : string) | any | 获取绘制属性 |
| setLayoutProperty (layerId : string,name : string,value : any,options : Object?) | this | 设置布局属性 |
| getLayoutProperty (layerId : string,name : string) | any | 获取布局属性 |
其他方法
| 方法 | 返回值 | 描述 |
|---|---|---|
| setFeatureState (feature : Object,state : Object) | 设置要素的状态。对象会与要素的现有状态合并。 | |
| removeFeatureState (feature : Object,key : string?) | 移除要素的状态 | |
| getFeatureState (feature : Object) | Object | 获取要素状态 |
| getCanvasContainer () | HTMLElement | 返回包含地图 |
| getCanvas () | HTMLCanvasElement | 返回地图的 |
| areTilesLoaded () | boolean | 瓦片加载完成 |
事件
| 事件名称 | 数据 | 描述 | |
|---|---|---|---|
| resize | 改变地图大小事件 | ||
| remove | 地图移除事件 | ||
| click | MapMouseEvent | 单击 | |
| dblclick | MapMouseEvent | 双击 | |
| mousedown | MapMouseEvent | 鼠标按下事件 | |
| mouseup | MapMouseEvent | 鼠标弹起 | |
| mouseover | MapMouseEvent | 鼠标移到 | |
| mousemove | MapMouseEvent | 鼠标移动 | |
| mouseenter | MapMouseEvent | 鼠标进入 | |
| mouseleave | MapMouseEvent | 鼠标离开 | |
| movestart | {originalEvent : DragEvent} | 地图移动开始 | |
| move | MapMouseEvent | MapTouchEvent | 地图移动 | |
| moveend | {originalEvent : DragEvent} | 地图移动结束 | |
| dragstart | {originalEvent : DragEvent} | 地图拖动开始 | |
| drag | MapMouseEvent | MapTouchEvent | 地图拖动 | |
| dragend | {originalEvent : DragEvent} | 地图拖动结束 | |
| zoomstart | MapMouseEvent | MapTouchEvent | 地图级别改变开始 | |
| zoom | MapMouseEvent | MapTouchEvent | 地图级别改变 | |
| zoomend | MapMouseEvent | MapTouchEvent | 地图级别改变结束 | |
| rotatestart | MapMouseEvent | MapTouchEvent | 地图旋转开始 | |
| rotate | MapMouseEvent | MapTouchEvent | 地图旋转 | |
| rotateend | MapMouseEvent | MapTouchEvent | 地图旋转结束 | |
| pitchstart | MapEventData | 地图倾斜开始 | |
| pitch | MapEventData | 地图倾斜 | |
| pitchend | MapEventData | 地图倾斜结束 | |
| load | 地图所以资源加载完成 | ||
| styledata | MapDataEvent | 加载或改变地图样式 | |
| sourcedata | MapDataEvent | 加载或改变数据源 | |
| error | 出现错误 | ||
| data | MapDataEvent | 地图数据加载或改变 |