Skip to content

类型定义

基础类型

FeatureColor

名称类型描述
FeatureColorstring颜色值,如:"#fff"、"rgba(255,255,255,0.5)",也可以是feature.properties中的属性名称

SourceData

名称类型描述
SourceDataGeoJSON.FeatureCollection|string数据源,可以是GeoJSON要素集合对象或URL字符串

事件类型

Events

名称类型描述
EventsObject事件回调函数集合

Events 属性详情

属性名类型描述
onMouseEnter(event: any) => void鼠标移入事件回调
onMouseMove(event: any) => void鼠标移动事件回调
onMouseLeave(event: any) => void鼠标移出事件回调
onClick(event: any) => void鼠标点击事件回调

图层配置类型

TileOptions

名称类型描述
TileOptionsObject瓦片图层配置

TileOptions 属性详情

属性名类型描述
tilesstring|string[]瓦片地址
beforeIdstring在某个图层之前的图层key

ImageOptions

名称类型描述
ImageOptionsObject图片图层配置

ImageOptions 属性详情

属性名类型描述
urlstring图片地址
coordinates[number, number][]图片四个角坐标
beforeIdstring在某个图层之前的图层key

PolygonOptions

名称类型描述
PolygonOptionsObject & Events多边形图层配置

PolygonOptions 属性详情

属性名类型描述默认值
sourceSourceData数据源-
beforeIdstring在某个图层之前的图层key-
defaultColorFeatureColor默认颜色transparent
hoverColorFeatureColor鼠标悬停颜色rgba(105,164,236,0.3)
activeColorFeatureColor鼠标点击颜色rgba(105,164,236,0.5)
defaultLineColorFeatureColor默认边框颜色-
hoverLineColorFeatureColor鼠标悬停时边框颜色-
activeLineColorFeatureColor鼠标点击时边框颜色-
lineWidthnumber边框宽度0

PolylineOptions

名称类型描述
PolylineOptionsObject & Events折线图层配置

PolylineOptions 属性详情

属性名类型描述默认值
sourceSourceData数据源-
beforeIdstring在某个图层之前的图层key-
defaultColorFeatureColor默认颜色transparent
hoverColorFeatureColor鼠标悬停颜色transparent
activeColorFeatureColor鼠标点击颜色transparent
lineWidthnumber线宽度2

DrawOptions

名称类型描述
DrawOptionsObject & mapdraw.DrawOptions绘制工具配置

DrawOptions 属性详情

属性名类型描述默认值
fillColorFeatureColor默认面颜色rgba(59,178,208,0.3)
fillActiveColorFeatureColor选中面颜色rgba(59,178,208,0.5)
lineColorFeatureColor默认线颜色#3BB2D0
lineActiveColorFeatureColor选中线颜色#3BB2D0
lineWidthnumber线宽度3
pointColorFeatureColor默认点颜色#3BB2D0
pointActiveColorFeatureColor选中点颜色#3BB2D0
pointOuterColorFeatureColor默认点外圈颜色#ffffff
pointOuterActiveColorFeatureColor选中点外圈颜色#ffffff
pointRadiusnumber点半径5
vertexColorFeatureColor顶点颜色#fbb03b
vertexActiveColorFeatureColor顶点选中颜色#fbb03b
vertexOuterColorFeatureColor顶点外圈颜色#ffffff
vertexOuterActiveColorFeatureColor顶点外圈选中颜色#ffffff
vertexRadiusnumber顶点半径3

覆盖物类型

PopupOptions

名称类型描述
PopupOptionsObject弹窗配置

PopupOptions 属性详情

属性名类型描述
coordinateLngLatLike弹窗坐标
addMapboolean是否添加进地图
domContentNodedom结构内容
htmlstring富文本
textstring文本内容
showboolean显示隐藏弹窗
pointerEventsauto|none弹窗响应鼠标事件
altitudenumber海拔
closeButtonboolean弹窗关闭按钮
closeOnClickboolean弹窗点击地图关闭
closeOnMoveboolean弹窗移动地图关闭
focusAfterOpenboolean弹窗打开时是否聚焦
anchorAnchor弹窗锚点
classNamestring弹窗样式类名
offsetOffset弹窗偏移量
maxWidthstring弹窗最大宽度

MarkerOptions

名称类型描述
MarkerOptionsObject标记配置

MarkerOptions 属性详情

属性名类型描述
coordinateLngLatLike位置坐标
addMapboolean是否添加进地图
showboolean显示隐藏
pointerEventsauto|none响应鼠标事件
popupPopup弹窗
altitudenumber海拔
anchorAnchor弹窗锚点
classNamestring弹窗样式类名
offsetPointLike弹窗偏移量
draggableboolean是否可以拖拽
elementHTMLElement元素
rotationnumber旋转角度
rotationAlignmentstring旋转对齐方向
pitchAlignmentstring俯仰对齐
occludedOpacitynumber闭塞不透明

控件类型

ControlTypes

名称类型描述
ControlTypesEnum控件类型枚举

ControlTypes 枚举值详情

枚举值描述
scale比例尺控件
compass指南针控件
attribution版权信息控件
miniMap鹰眼地图控件
fullscreen全屏控件
navigation导航控件
geolocate定位控件

ControlOptions

名称类型描述
ControlOptionsScaleOptions | CompassOptions | AttributionOptions | MiniMapOptions | FullscreenOptions | NavigationOptions | GeolocateOptions控件配置选项

ScaleOptions

名称类型描述
ScaleOptionsObject & mapboxgl.ScaleControlOptions比例尺控件配置

ScaleOptions 属性详情

属性名类型描述
positionmapboxgl.ControlPosition控件位置

CompassOptions

名称类型描述
CompassOptionsObject & mapboxgl.ControlOptions指南针控件配置

CompassOptions 属性详情

属性名类型描述
positionmapboxgl.ControlPosition控件位置
rotateAbleboolean是否可旋转
pitchAbleboolean是否可俯仰
classNamestring样式类名

MiniMapOptions

名称类型描述
MiniMapOptionsObject鹰眼地图控件配置

MiniMapOptions 属性详情

属性名类型描述默认值
layerstring瓦片地址-
widthstring控件的宽度300px
heightstring控件的高度200px
positionstring控件位置top-left, top-right, bottom-left, bottom-right
boundsstring控件的显示边界parent
zoomLevelsnumber鹰眼地图与当前地图的zoom差4
lineColorFeatureColor鹰眼控件边界范围的线颜色#f17c67
lineWidthnumber鹰眼控件边界范围的线宽2
lineOpacitynumber鹰眼控件边界范围的线透明度1
fillColorFeatureColor鹰眼控件边界范围的面颜色#eb3f2f
fillOpacitynumber鹰眼控件边界范围的面透明度0.5

名称类型描述
NavigationOptionsObject & mapboxgl.NavigationControlOptions导航控件配置
属性名类型描述
positionmapboxgl.ControlPosition控件位置

GeolocateOptions

名称类型描述
GeolocateOptionsObject & mapboxgl.GeolocateControlOptions定位控件配置

GeolocateOptions 属性详情

属性名类型描述
positionmapboxgl.ControlPosition控件位置

FullscreenOptions

名称类型描述
FullscreenOptionsObject & mapboxgl.FullscreenControlOptions全屏控件配置

FullscreenOptions 属性详情

属性名类型描述
positionmapboxgl.ControlPosition控件位置

AttributionOptions

名称类型描述
AttributionOptionsObject & mapboxgl.AttributionControlOptions版权信息控件配置

AttributionOptions 属性详情

属性名类型描述
positionmapboxgl.ControlPosition控件位置

其他类型

Layer

名称类型描述
LayerPolygonLayer | PolylineLayer图层类型

Overlay

名称类型描述
OverlayMarkerOverlay | PopupOverlay覆盖物类型

Offset

名称类型描述
Offsetnumber|PointLike|Partial<Record<Anchor, PointLike>>偏移量

地图核心类型

Map

名称类型描述
MapObject地图实例对象

Map 方法详情

方法名类型描述
addLayer(layer: [Layer](#Layer), beforeId?: string) => string添加图层
removeLayer(id: string) => void移除图层
setFilter(layerId: string, filter: any[]) => void设置图层过滤条件
getLayer(id: string) => [Layer](#Layer)| undefined获取图层
load(style: Style| string) => Promise<void>加载地图样式
loadURL(url: string) => Promise<void>从URL加载地图样式
loadJSON(json: Style) => Promise<void>加载JSON格式的地图样式
queryRenderedFeatures(geometry?: [Geometry](#Geometry), options?: [QueryOptions](#QueryOptions)) => [Feature](#Feature)[]查询渲染的要素
querySourceFeatures(sourceId: string, options?: [QuerySourceFeaturesOptions](#QuerySourceFeaturesOptions)) => [Feature](#Feature)[]查询源数据要素
setCenter(center: LngLatLike) => Map设置地图中心点
getCenter() => LngLat获取地图中心点
setZoom(zoom: number) => Map设置地图缩放级别
getZoom() => number获取地图缩放级别
setPitch(pitch: number) => Map设置地图俯仰角
getPitch() => number获取地图俯仰角
setBearing(bearing: number) => Map设置地图旋转角
getBearing() => number获取地图旋转角
fitBounds(bounds: LngLatBoundsLike, options?: [FitBoundsOptions](#FitBoundsOptions)) => [Map](#Map)调整地图视野以适应边界
panTo(lnglat: LngLatLike, options?: [PanOptions](#PanOptions)) => [Map](#Map)平移地图到指定位置
zoomTo(zoom: number, options?: [ZoomOptions](#ZoomOptions)) => [Map](#Map)缩放地图到指定级别

Style

名称类型描述
StyleObject地图样式对象

Style 属性详情

属性名类型描述
versionnumber样式版本
namestring样式名称
sourcesRecord<string, [Source](#Source)>数据源集合
layers[Layer](#Layer)[]图层数组
center[number, number]地图中心点
zoomnumber地图缩放级别
pitchnumber地图俯仰角
bearingnumber地图旋转角
terrainTerrainOptions地形配置
fogFogOptions雾效配置
lightLightOptions光照配置

Source

名称类型描述
SourceGeoJSONSource | VectorSource | RasterSource | RasterDemSource数据源基类

GeoJSONSource

名称类型描述
GeoJSONSourceObjectGeoJSON数据源

GeoJSONSource 属性详情

  • type: 'geojson' - 数据源类型
  • data: GeoJSON.FeatureCollection | string - GeoJSON数据或URL
  • cluster: boolean - 是否聚合
  • clusterRadius: number - 聚合半径
  • clusterMaxZoom: number - 聚合最大缩放级别
  • clusterMinPoints: number - 最小聚合点数
  • generateId: boolean - 是否生成要素ID

VectorSource

名称类型描述
VectorSourceObject矢量数据源

VectorSource 属性详情

属性名类型描述
type'vector'数据源类型
tilesstring[]瓦片URL数组
minzoomnumber最小缩放级别
maxzoomnumber最大缩放级别
attributionstring版权信息

RasterSource

名称类型描述
RasterSourceObject栅格数据源

RasterSource 属性详情

属性名类型描述
type'raster'数据源类型
tilesstring[]瓦片URL数组
minzoomnumber最小缩放级别
maxzoomnumber最大缩放级别
tileSizenumber瓦片大小
attributionstring版权信息

RasterDemSource

名称类型描述
RasterDemSourceObject栅格DEM数据源

RasterDemSource 属性详情

属性名类型描述
type'raster-dem'数据源类型
tilesstring[]瓦片URL数组
minzoomnumber最小缩放级别
maxzoomnumber最大缩放级别
tileSizenumber瓦片大小
attributionstring版权信息

坐标转换类型

LngLat

名称类型描述
LngLatObject经纬度坐标

LngLat 属性详情

属性名类型描述
lngnumber经度
latnumber纬度

LngLat 方法详情

方法名类型描述
distanceTo(lnglat: LngLatLike) => number计算到另一个坐标的距离(米)
wrap() => LngLat将经度包装到[-180, 180)范围
toArray() => [number, number]转换为数组
toString() => string转换为字符串

LngLatBounds

名称类型描述
LngLatBoundsObject经纬度边界

LngLatBounds 属性详情

属性名类型描述
southwestLngLat西南角坐标
northeastLngLat东北角坐标

LngLatBounds 方法详情

方法名类型描述
contains(lnglat: LngLatLike) => boolean判断坐标是否在边界内
getCenter() => LngLat获取边界中心点
getSouthWest() => LngLat获取西南角坐标
getNorthEast() => LngLat获取东北角坐标
toArray() => [number, number, number, number]转换为数组

Point

名称类型描述
PointObject屏幕坐标

Point 属性详情

属性名类型描述
xnumberX坐标
ynumberY坐标

Point 方法详情

方法名类型描述
distanceTo(point: PointLike) => number计算到另一个点的距离
toArray() => [number, number]转换为数组

查询参数类型

QueryOptions

名称类型描述
QueryOptionsObject查询渲染要素参数

QueryOptions 属性详情

属性名类型描述
layersstring[]要查询的图层ID数组
filterany[]查询过滤条件
validateboolean是否验证要素几何

QuerySourceFeaturesOptions

名称类型描述
QuerySourceFeaturesOptionsObject查询源数据要素参数

QuerySourceFeaturesOptions 属性详情

属性名类型描述
sourceLayerstring源图层名称
filterany[]查询过滤条件
geometryGeometry几何范围

环境配置类型

TerrainOptions

名称类型描述
TerrainOptionsObject地形配置

TerrainOptions 属性详情

属性名类型描述
sourcestring地形数据源ID
exaggerationnumber地形夸张程度
displacementnumber地形位移
maskGeometry地形蒙版

FogOptions

名称类型描述
FogOptionsObject雾效配置

FogOptions 属性详情

属性名类型描述
colorstring雾颜色
range[number, number]雾范围
exponentnumber雾指数
horizonBlendnumber地平线混合度

LightOptions

名称类型描述
LightOptionsObject光照配置

LightOptions 属性详情

属性名类型描述
colorstring光颜色
intensitynumber光强度
position[number, number, number]光源位置
direction[number, number, number]光方向
ambientnumber环境光强度

地图事件类型

MapEvent

名称类型描述
MapEventObject地图事件对象

MapEvent 属性详情

属性名类型描述
typestring事件类型
targetMap事件目标
originalEventEvent原始DOM事件
pointPoint事件发生的屏幕坐标
lngLatLngLat事件发生的经纬度坐标
featuresFeature[]与事件相关的要素数组
layerLayer与事件相关的图层

MapEventType

名称类型描述
MapEventTypestring地图事件类型枚举

MapEventType 可选值

描述
load地图加载完成
style.load地图样式加载完成
error地图加载错误
click鼠标点击
dblclick鼠标双击
mousedown鼠标按下
mouseup鼠标释放
mousemove鼠标移动
mouseenter鼠标进入
mouseleave鼠标离开
contextmenu右键菜单
wheel鼠标滚轮
touchstart触摸开始
touchmove触摸移动
touchend触摸结束
resize地图大小改变
move地图移动
moveend地图移动结束
zoom地图缩放
zoomend地图缩放结束
pitch地图俯仰角改变
pitchend地图俯仰角改变结束
rotate地图旋转
rotateend地图旋转结束

图层样式类型

LayerStyle

名称类型描述
LayerStyleObject图层样式基类

LayerStyle 属性详情

属性名类型描述
idstring图层ID
typestring图层类型
sourcestring数据源ID
sourceLayerstring源图层名称
minzoomnumber最小缩放级别
maxzoomnumber最大缩放级别
filterany[]过滤条件
layoutObject布局属性
paintObject绘制属性

PolygonLayerStyle

名称类型描述
PolygonLayerStyleObject & LayerStyle多边形图层样式

PolygonLayerStyle 特有属性

属性名类型描述
fillColorFeatureColor填充颜色
fillOpacitynumber填充透明度
fillOutlineColorFeatureColor轮廓颜色
fillPatternstring填充图案

PolylineLayerStyle

名称类型描述
PolylineLayerStyleObject & LayerStyle折线图层样式

PolylineLayerStyle 特有属性

属性名类型描述
lineColorFeatureColor线颜色
lineOpacitynumber线透明度
lineWidthnumber线宽度
lineJoinstring线连接方式
lineCapstring线端点样式
lineDasharraystring虚线样式
linePatternstring线图案

几何类型

Geometry

名称类型描述
GeometryPointGeometry|LineStringGeometry|PolygonGeometry|MultiPointGeometry|MultiLineStringGeometry|MultiPolygonGeometry|GeometryCollection几何类型基类

PointGeometry

名称类型描述
PointGeometryObject点几何

PointGeometry 属性详情

属性名类型描述
type'Point'几何类型
coordinates[number, number]坐标
bbox[number, number, number, number]边界框

LineStringGeometry

名称类型描述
LineStringGeometryObject线几何

LineStringGeometry 属性详情

属性名类型描述
type'LineString'几何类型
coordinates[number, number][]坐标数组
bbox[number, number, number, number]边界框

PolygonGeometry

名称类型描述
PolygonGeometryObject面几何

PolygonGeometry 属性详情

属性名类型描述
type'Polygon'几何类型
coordinates[[number, number][]]坐标数组
bbox[number, number, number, number]边界框

动画配置类型

AnimationOptions

名称类型描述
AnimationOptionsObject动画配置

AnimationOptions 属性详情

属性名类型描述默认值
durationnumber动画持续时间(毫秒)300
easing(t: number) => number缓动函数t => t
offsetOffset动画偏移量0
animateboolean是否启用动画true

高级地图类型

MapDataAdapter

名称类型描述
MapDataAdapterObject地图数据适配器

MapDataAdapter 方法详情

方法名类型描述
getData(params: any) => Promise<[GeoJSON.FeatureCollection](#GeoJSONFeatureCollection)>获取数据
updateData(data: [GeoJSON.FeatureCollection](#GeoJSONFeatureCollection)) => void更新数据
clearData() => void清除数据
getFeatureById(id: string) => [Feature](#Feature) | undefined根据ID获取要素
updateFeature(feature: [Feature](#Feature)) => void更新要素
removeFeature(id: string) => void删除要素

MapAnalysis

名称类型描述
MapAnalysisObject地图分析工具

MapAnalysis 方法详情

方法名类型描述
buffer(geometry: [Geometry](#Geometry), radius: number) => [Geometry](#Geometry)缓冲区分析
intersect(geometry1: [Geometry](#Geometry), geometry2: [Geometry](#Geometry)) => [Geometry](#Geometry)相交分析
union(geometry1: [Geometry](#Geometry), geometry2: [Geometry](#Geometry)) => [Geometry](#Geometry)合并分析
difference(geometry1: [Geometry](#Geometry), geometry2: [Geometry](#Geometry)) => [Geometry](#Geometry)差异分析
contains(geometry1: [Geometry](#Geometry), geometry2: [Geometry](#Geometry)) => boolean包含分析
distance(geometry1: [Geometry](#Geometry), geometry2: [Geometry](#Geometry)) => number距离计算
area(geometry: [Geometry](#Geometry)) => number面积计算
length(geometry: [Geometry](#Geometry)) => number长度计算

MapLayerManager

名称类型描述
MapLayerManagerObject图层管理器

MapLayerManager 方法详情

方法名类型描述
addLayer(layer: [Layer](#Layer), options?: {beforeId?: string}) => string添加图层
removeLayer(id: string) => void移除图层
getLayer(id: string) => [Layer](#Layer) | undefined获取图层
updateLayer(id: string, update: Partial<[Layer](#Layer)>) => void更新图层
setLayerVisibility(id: string, visible: boolean) => void设置图层可见性
getLayerVisibility(id: string) => boolean获取图层可见性
setLayerStyle(id: string, style: Object) => void设置图层样式
getLayerStyle(id: string) => Object获取图层样式
getAllLayers() => [Layer](#Layer)[]获取所有图层
getLayersByType(type: string) => [Layer](#Layer)[]按类型获取图层

MapUtil

名称类型描述
MapUtilObject地图工具类

MapUtil 静态方法详情

方法名类型描述
transform(point: [Point](#Point), from: string, to: string) => [Point](#Point)坐标转换
project(lnglat: LngLatLike) => [Point](#Point)经纬度转屏幕坐标
unproject(point: PointLike) => [LngLat](#LngLat)屏幕坐标转经纬度
wrapLng(lng: number) => number经度包装到[-180, 180)
formatNumber(num: number, precision?: number) => string数字格式化
distanceFormat(distance: number) => string距离格式化
isPointInPolygon(point: PointLike, polygon: [Geometry](#Geometry)) => boolean判断点是否在多边形内
generateUUID() => string生成UUID

完善现有类型定义

扩展 Geometry 类型

MultiPointGeometry

名称类型描述
MultiPointGeometryObject多点几何

MultiPointGeometry 属性详情

属性名类型描述
type'MultiPoint'几何类型
coordinates[number, number][]坐标数组
bbox[number, number, number, number]边界框

MultiLineStringGeometry

名称类型描述
MultiLineStringGeometryObject多线几何

MultiLineStringGeometry 属性详情

属性名类型描述
type'MultiLineString'几何类型
coordinates[[number, number][]]坐标数组
bbox[number, number, number, number]边界框

MultiPolygonGeometry

名称类型描述
MultiPolygonGeometryObject多面几何

MultiPolygonGeometry 属性详情

属性名类型描述
type'MultiPolygon'几何类型
coordinates[[[number, number][]]]坐标数组
bbox[number, number, number, number]边界框

GeometryCollection

名称类型描述
GeometryCollectionObject几何集合

GeometryCollection 属性详情

属性名类型描述
type'GeometryCollection'几何类型
geometriesGeometry[]几何数组
bbox[number, number, number, number]边界框

扩展 Layer 类型

CircleLayer

名称类型描述
CircleLayerObject圆形图层

CircleLayer 属性详情

属性名类型描述
idstring图层ID
type'circle'图层类型
sourcestring数据源ID
sourceLayerstring源图层名称
minzoomnumber最小缩放级别
maxzoomnumber最大缩放级别
filterany[]过滤条件
layoutObject布局属性
paintObject绘制属性

SymbolLayer

名称类型描述
SymbolLayerObject符号图层

SymbolLayer 属性详情

属性名类型描述
idstring图层ID
type'symbol'图层类型
sourcestring数据源ID
sourceLayerstring源图层名称
minzoomnumber最小缩放级别
maxzoomnumber最大缩放级别
filterany[]过滤条件
layoutObject布局属性
paintObject绘制属性

HeatmapLayer

名称类型描述
HeatmapLayerObject热力图图层

HeatmapLayer 属性详情

属性名类型描述
idstring图层ID
type'heatmap'图层类型
sourcestring数据源ID
sourceLayerstring源图层名称
minzoomnumber最小缩放级别
maxzoomnumber最大缩放级别
filterany[]过滤条件
layoutObject布局属性
paintObject绘制属性

扩展控制选项类型

FitBoundsOptions

名称类型描述
FitBoundsOptionsObject调整视野选项

FitBoundsOptions 属性详情

属性名类型描述默认值
paddingnumber | Object内边距0
maxZoomnumber最大缩放级别-
durationnumber动画持续时间300
easing(t: number) => number缓动函数t => t

PanOptions

名称类型描述
PanOptionsObject平移选项

PanOptions 属性详情

属性名类型描述默认值
durationnumber动画持续时间300
easing(t: number) => number缓动函数t => t
offsetOffset偏移量0

ZoomOptions

名称类型描述
ZoomOptionsObject缩放选项

ZoomOptions 属性详情

属性名类型描述默认值
durationnumber动画持续时间300
easing(t: number) => number缓动函数t => t
aroundLngLatLike | PointLike缩放中心点-

其他类型

Anchor

名称类型描述
Anchorstring锚点位置

Anchor 可选值

描述
center中心
top顶部
bottom底部
left左侧
right右侧
top-left左上角
top-right右上角
bottom-left左下角
bottom-right右下角

GeoJSON.FeatureCollection

名称类型描述
GeoJSON.FeatureCollectionObjectGeoJSON要素集合

GeoJSON.FeatureCollection 属性详情

属性名类型描述
typestring类型,固定为FeatureCollection
featuresArray<[Feature](#Feature)>要素数组
bbox[number, number, number, number]|[number, number, number, number, number, number]边界框