MapboxGL.MapView
整理自官方文档,错误之处欢迎指正。
<MapboxGL.MapView />
props 属性
Prop | Type | Default | Required |
---|---|---|---|
contentInset | union |
none |
false |
The distance from the edges of the map view’s frame to the edges of the map view’s logical viewport.
从地图视图框架的边缘到地图视图逻辑视口边缘的距离。
style | any |
none |
false |
---|
Style for wrapping React Native View
所在RN视图的样式
styleURL | string |
MapboxGL.StyleURL.Street |
false |
---|
Style URL for map
地图的样式URL
localizeLabels | bool |
false |
false |
---|
Automatically change the language of the map labels to the system’s preferred language,this is not something that can be toggled on/off
自动将地图标签的语言更改为系统的首选语言,这不能切换为打开/关闭
zoomEnabled | bool |
none |
false |
---|
Enable/Disable zoom on the map
在地图上启用/禁用缩放
scrollEnabled | bool |
true |
false |
---|
Enable/Disable scroll on the map
在地图上启用/禁用滚动
pitchEnabled | bool |
true |
false |
---|
Enable/Disable pitch on map
在地图上启用/禁用倾斜
rotateEnabled | bool |
true |
false |
---|
Enable/Disable rotation on map
在地图上启用/禁用旋转
attributionEnabled | bool |
true |
false |
---|
是否显示属性说明
The Mapbox terms of service, which governs the use of Mapbox-hosted vector tiles and styles,
requires these copyright notices to accompany any map that features Mapbox-designed styles, OpenStreetMap data, or other Mapbox data such as satellite or terrain data.
If that applies to this map view, do not hide this view or remove any notices from it.
You are additionally required to provide users with the option to disable anonymous usage and location sharing (telemetry).
If this view is hidden, you must implement this setting elsewhere in your app. See our website for Android and iOS for implementation details.
Enable/Disable attribution on map. For iOS you need to add MGLMapboxMetricsEnabledSettingShownInApp=YES
to your Info.plist
Mapbox服务条款,管理Mapbox托管的矢量切片和样式的使用,这些版权声明随附任何具有Mapbox设计样式,OpenStreetMap数据,或其他Mapbox数据,例如卫星或地形数据。如果这适用于此地图视图,请勿隐藏此视图或从中删除任何通知。
您还需要为用户提供禁用匿名使用和位置共享(遥测)的选项。如果此视图被隐藏,你必须在你的应用程序的其他地方实现此设置。
logoEnabled | bool |
true |
false |
---|
Enable/Disable the logo on the map.
启用/禁用地图上的 logo 。
compassEnabled | bool |
none |
false |
---|
Enable/Disable the compass from appearing on the map
启用/禁用指南针显示在地图上
surfaceView | bool |
false |
false |
---|
[Android only] Enable/Disable use of GLSurfaceView insted of TextureView.
[仅Android]启用/禁用TextureView的GLSurfaceView实例。
onPress | func |
none |
false |
---|
Map press listener, gets called when a user presses the map
地图按下侦听器,当用户按下地图时被调用
onLongPress | func |
none |
false |
---|
Map long press listener, gets called when a user long presses the map
地图长按侦听器,当用户长按地图时调用
onRegionWillChange | func |
none |
false |
---|
This event is triggered whenever the currently displayed map region is about to change.
只要当前显示的地图区域即将更改,就会触发此事件。
onRegionIsChanging | func |
none |
false |
---|
This event is triggered whenever the currently displayed map region is changing.
只要当前显示的地图区域发生变化,就会触发此事件。
onRegionDidChange | func |
none |
false |
---|
This event is triggered whenever the currently displayed map region finished changing
只要当前显示的地图区域完成更改,就会触发此事件
onWillStartLoadingMap | func |
none |
false |
---|
This event is triggered when the map is about to start loading a new map style.
当地图即将开始加载新的地图样式时,会触发此事件。
onDidFinishLoadingMap | func |
none |
false |
---|
This is triggered when the map has successfully loaded a new map style.
当地图成功加载新的地图样式时,会触发此事件。
onDidFailLoadingMap | func |
none |
false |
---|
This event is triggered when the map has failed to load a new map style.
当地图加载新地图样式失败时,会触发此事件。
onWillStartRenderingFrame | func |
none |
false |
---|
This event is triggered when the map will start rendering a frame.
当贴图开始渲染帧时,会触发此事件。
onDidFinishRenderingFrame | func |
none |
false |
---|
This event is triggered when the map finished rendering a frame.
此事件在地图完成渲染帧时触发。
onDidFinishRenderingFrameFully | func |
none |
false |
---|
This event is triggered when the map fully finished rendering a frame.
当地图完全完成渲染帧时,会触发此事件。
onWillStartRenderingMap | func |
none |
false |
---|
This event is triggered when the map will start rendering the map.
当地图开始渲染地图时,会触发此事件。
onDidFinishRenderingMap | func |
none |
false |
---|
This event is triggered when the map finished rendering the map.
此事件在地图完成渲染地图时触发。
onDidFinishRenderingMapFully | func |
none |
false |
---|
This event is triggered when the map fully finished rendering the map.
当地图完全完成渲染地图时,会触发此事件。
onDidFinishLoadingStyle | func |
none |
false |
---|
This event is triggered when a style has finished loading.
当样式加载完成时触发此事件。
regionWillChangeDebounceTime | number |
10 |
false |
---|
The emitted frequency of region will change events
regionDidChangeDebounceTime | number |
500 |
false |
---|
The emitted frequency of region did change events
methods 方法
getPointInView(coordinate)
Converts a geographic coordinate to a point in the given view’s coordinate system.
将地理坐标转换为给定视图坐标系中的点。
arguments
Name | Type | Required | Description |
---|---|---|---|
coordinate |
Array |
Yes |
A point expressed in the map view's coordinate system. |
在地图视图的坐标系中表示的点。
const pointInView = await this._map.getPointInView([-37.817070, 144.949901]);
getCoordinateFromView(point)
Converts a point in the given view’s coordinate system to a geographic coordinate.
将给定视图坐标系中的点转换为地理坐标。
arguments
Name | Type | Required | Description |
---|---|---|---|
point |
Array |
Yes |
A point expressed in the given view’s coordinate system. |
const coordinate = await this._map.getCoordinateFromView([100, 100]);
getVisibleBounds()
The coordinate bounds(ne, sw) visible in the users’s viewport.
在用户视口中可见的坐标边界(ne,sw)。
arguments
Name | Type | Required | Description |
---|
const visibleBounds = await this._map.getVisibleBounds();
queryRenderedFeaturesAtPoint(coordinate[, filter][, layerIDs])
Returns an array of rendered map features that intersect with a given point.
返回与给定点相交的渲染地图要素的数组。
arguments
Name | Type | Required | Description |
---|---|---|---|
coordinate |
Array |
Yes |
A point expressed in the map view’s coordinate system. |
filter |
Array |
No |
A set of strings that correspond to the names of layers defined in the current style. Only the features contained in these layers are included in the returned array. |
layerIDs |
Array |
No |
A array of layer id's to filter the features by |
this._map.queryRenderedFeaturesAtPoint([30, 40], ['==', 'type', 'Point'], ['id1', 'id2'])
queryRenderedFeaturesInRect(bbox[, filter][, layerIDs])
Returns an array of rendered map features that intersect with the given rectangle,restricted to the given style layers and filtered by the given predicate.
返回与给定矩形相交、仅限于给定样式图层并由给定谓词过滤的渲染地图要素数组。
arguments
Name | Type | Required | Description |
---|---|---|---|
bbox |
Array |
Yes |
A rectangle expressed in the map view’s coordinate system. |
filter |
Array |
No |
A set of strings that correspond to the names of layers defined in the current style. Only the features contained in these layers are included in the returned array. |
layerIDs |
Array |
No |
A array of layer id's to filter the features by |
this._map.queryRenderedFeaturesInRect([30, 40, 20, 10], ['==', 'type', 'Point'], ['id1', 'id2'])
fitBounds(northEastCoordinates, southWestCoordinates[, padding][, duration])
Map camera transitions to fit provided bounds
映射摄影机过渡以适应提供的边界
arguments
Name | Type | Required | Description |
---|---|---|---|
northEastCoordinates |
Array |
Yes |
North east coordinate of bound |
southWestCoordinates |
Array |
Yes |
South west coordinate of bound |
padding |
Number |
No |
Camera padding for bound |
duration |
Number |
No |
Duration of camera animation |
this.map.fitBounds([lng, lat], [lng, lat])
this.map.fitBounds([lng, lat], [lng, lat], 20, 1000) // padding for all sides
this.map.fitBounds([lng, lat], [lng, lat], [verticalPadding, horizontalPadding], 1000)
this.map.fitBounds([lng, lat], [lng, lat], [top, right, bottom, left], 1000)
flyTo(coordinates[, duration])
Map camera will fly to new coordinate
地图相机将飞到新坐标
arguments
Name | Type | Required | Description |
---|---|---|---|
coordinates |
Array |
Yes |
Coordinates that map camera will jump too |
duration |
Number |
No |
Duration of camera animation |
this.map.flyTo([lng, lat])
this.map.flyTo([lng, lat], 12000)
moveTo(coordinates[, duration])
Map camera will move to new coordinate at the same zoom level
地图相机将移动到相同缩放级别的新坐标
arguments
Name | Type | Required | Description |
---|---|---|---|
coordinates |
Array |
Yes |
Coordinates that map camera will move too |
duration |
Number |
No |
Duration of camera animation |
this.map.moveTo([lng, lat], 200) // eases camera to new location based on duration
this.map.moveTo([lng, lat]) // snaps camera to new location without any easing
zoomTo(zoomLevel[, duration])
Map camera will zoom to specified level
地图相机将缩放到指定级别
arguments
Name | Type | Required | Description |
---|---|---|---|
zoomLevel |
Number |
Yes |
Zoom level that the map camera will animate too |
duration |
Number |
No |
Duration of camera animation |
this.map.zoomTo(16)
this.map.zoomTo(16, 100)
setCamera(config)
Map camera will perform updates based on provided config. Deprecated use Camera#setCamera.
arguments
Name | Type | Required | Description |
---|---|---|---|
config |
n/a |
Yes |
undefined |
takeSnap(writeToDisk)
Takes snapshot of map with current tiles and returns a URI to the image
拍摄包含当前切片的地图快照,并将URI返回到图像
arguments
Name | Type | Required | Description |
---|---|---|---|
writeToDisk |
Boolean |
Yes |
If true will create a temp file, otherwise it is in base64 |
getZoom()
Returns the current zoom of the map view.
返回地图视图的当前缩放。
arguments
Name | Type | Required | Description |
---|
const zoom = await this._map.getZoom();
getCenter()
Returns the map's geographical centerpoint
返回地图的地理中心点
arguments
Name | Type | Required | Description |
---|
const center = await this._map.getCenter();
showAttribution()
Show the attribution and telemetry action sheet.
If you implement a custom attribution button, you should add this action to the button.
显示属性和遥测操作表。
如果实现自定义属性按钮,则应将此操作添加到按钮。
arguments
Name | Type | Required | Description |
---|