模块级的build.gradle文件添加：
dependencies {
implementation 'com.mapbox.mapboxsdk:mapbox-android-sdk:9.3.0'
添加私密令牌：
在gradle.properties文件中添加
MAPBOX_DOWNLOADS_TOKEN = 私密令牌
项目级的build.gradle文件添加：
maven {
url 'https :
authentication {
basic (BasicAuthentication)
credentials {
username = 'mapbox '
password = project.properties['MAPBOX_DOWNLOADS_TOKEN '] ?: ""
添加公共令牌：
打开R.strings.xml文件
添加 <string name="mapbox_access_token" >公共令牌</string >
在清单文件中配置权限：
<uses-permission android:name ="android.permission.ACCESS_FINE_LOCATION" />
初始化Mapbox，建议在Application中：
Mapbox.getInstance(this , resources.getString(R.string .mapbox_access_token))
MapBox的使用
布局文件中添加MapBox
<com.mapbox.mapboxsdk.maps.MapView
android:id ="@+id/Activity_Main_Map"
android:layout_width ="match_parent"
android:layout_height ="match_parent"
mapbox:mapbox_cameraZoom ="12" />
mapbox:mapbox_cameraZoom表示初始化的缩放等级
添加生命周期方法
override fun onCreate (savedInstanceState: Bundle ?) super .onCreate(savedInstanceState)
Activity_Main_Map.onCreate(savedInstanceState)
override fun onStart () super .onStart()
Activity_Main_Map.onStart()
override fun onResume () super .onResume()
Activity_Main_Map.onResume()
override fun onPause () super .onPause()
Activity_Main_Map.onPause()
override fun onStop () super .onStop()
Activity_Main_Map.onStop()
override fun onSaveInstanceState (outState: Bundle ) super .onSaveInstanceState(outState)
Activity_Main_Map.onSaveInstanceState(outState)
override fun onLowMemory () super .onLowMemory()
Activity_Main_Map.onLowMemory()
override fun onDestroy () super .onDestroy()
Activity_Main_Map.onDestroy()
设置地图相关设置，在Activity_Main_Map.onCreate(savedInstanceState)后加入：
Activity_Main_Map.getMapAsync{ mapboxMap ->
mapboxMap.setStyle(Style.OUTDOORS) { style ->
val uiSettings = mapboxMap.uiSettings
uiSettings.setCompassMargins(0 , AutoSizeUtils.mm2px(this , 120f ), AutoSizeUtils.mm2px(this , 40f ), 0 )
val localizationPlugin = LocalizationPlugin(Activity_Main_Map, mapboxMap, style)
localizationPlugin.setMapLanguage(MapLocale.SIMPLIFIED_CHINESE)
val customLocationComponentOptions = LocationComponentOptions.builder(this )
.trackingGesturesManagement(true )
.accuracyColor(ContextCompat.getColor(this , R.color.mapboxGreen))
.build()
val locationComponentActivationOptions = LocationComponentActivationOptions
.builder(this , style)
.locationComponentOptions(customLocationComponentOptions)
.useDefaultLocationEngine(true )
.build()
this .mLocationComponent = mapboxMap.locationComponent
this .mLocationComponent.apply {
activateLocationComponent(locationComponentActivationOptions)
isLocationComponentEnabled = true
cameraMode = CameraMode.TRACKING_COMPASS
renderMode = RenderMode.COMPASS
一些其他操作
将地图源替换为天地图的源
1. 先创建天地图账号，获取token
2. 在assets文件中创建一个json文件：
"version" : 8 ,
"sources" : {
"URL_VECTOR_2000" : {
"tiles" : [ "http://t0.tianditu.gov.cn/vec_w/wmts?tk=你的token&SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=w&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&FORMAT=tiles" ] ,
"type" : "raster" ,
"tileSize" : 256
"URL_VECTOR_ANNOTATION_CHINESE_2000" : {
"tiles" : [ "http://t0.tianditu.gov.cn/cva_w/DataServer?T=cva_w&X={x}&Y={y}&L={z}&tk=你的token" ] ,
"type" : "raster" ,
"tileSize" : 256
"layers" : [
"id" : "URL_VECTOR_2000" ,
"type" : "raster" ,
"source" : "URL_VECTOR_2000" ,
"maxzoom" : 22
"id" : "URL_VECTOR_ANNOTATION_CHINESE_2000" ,
"type" : "raster" ,
"source" : "URL_VECTOR_ANNOTATION_CHINESE_2000" ,
"maxzoom" : 22
3. 设置MapBox的Style：
mMapBoxMap.setStyle(Style.Builder().fromUri("asset://Json文件" ))
创建一个Marker（标记点）
mMapBoxMap.getStyle {
if (it.getLayer("Home_Layer" ) != null ) {
return @getStyle
it.addImage("marker_icon" , BitmapFactory.decodeResource(resources, R.drawable.red_marker))
it.addSource(getMarkerSource())
it.addLayer(SymbolLayer("Home_Layer" , "Home" )
.withProperties(
PropertyFactory.iconImage("marker_icon" ),
PropertyFactory.iconIgnorePlacement(true ),
PropertyFactory.iconAllowOverlap(true )
* 指定坐标数据
fun getMarkerSource () val lat = 25.02365687211753
val lng = 102.73601658370522
return GeoJsonSource("Home" , Feature.fromGeometry(Point.fromLngLat(lng, lat)))
设置点击事件（比如给Marker设置一个点击后移动到该Marker位置的事件）
mMapBoxMap.addOnMapClickListener(this )
override fun onMapClick (point: LatLng ) Boolean {
return handleClickIcon(mMapBoxMap.projection.toScreenLocation(point))
* 处理点击事件
* 大概逻辑就是，当点击地图某个点时，检索有没有符合的Feature，有的话处理返回false
private fun handleClickIcon (screenPoint: PointF ) Boolean {
val features: List<Feature> = mMapBoxMap.queryRenderedFeatures(
screenPoint,
"Home_Layer"
return if (features.isNotEmpty()) {
features[0 ].geometry()?.let {
if (it.type() == "Point" ) {
val point = it as Point
movePosition(LatLng(point.latitude(), point.longitude()), 18.0 , 180.0 , 30.0 )
} else {
false
地图加载不出来咋办？
Activity_Main_Map.addOnDidFailLoadingMapListener {
LogUtils.eTag ("Angki" , it)
经纬度不对？
MapBox默认使用的WGS84坐标系，而国内使用的是GCJ-02。所以在把地图源替换为天地图源后坐标会偏移。可以使用MapBox提供的中国插件，把MapView替换为ChinaMapView。就是这个插件需要特殊的令牌，估计是要购买。
MapBox官方文档齐全，但是就不要看国内的那个官方文档，太老了。然后地图的一些显示和效果也都有例子。建议把官方demo跑一下，就能知道可以做些什么。
KoProject
Vue.js
4608
Freedom风间
JavaScript
Vue.js
5.7w
程序员小北
ChatGPT
掘金·日新计划
