在Android/iOS端Mapbox地图中加载自定义3D模型是否可行？

结论：完全可以实现，Mapbox的Android和iOS原生SDK都支持加载GLTF/GLB格式的3D模型，对于OBJ格式也可以通过格式转换或辅助工具实现集成，以下是具体实现思路：

Android端实现方式 #

• 原生支持GLTF/GLB格式：通过ModelSource加载模型资源（本地或网络），再创建ModelLayer添加到地图样式中，即可在指定经纬度位置渲染3D模型。
  示例代码片段：

  // 创建模型数据源
  val modelSource = ModelSource(
      "custom-model-source",
      Uri.fromFile(File(context.filesDir, "model.glb")),
      ModelSourceOptions.Builder().build()
  )
  // 创建模型图层
  val modelLayer = ModelLayer(
      "custom-model-layer",
      "custom-model-source",
      ModelLayerOptions.Builder()
          .modelId("model")
          .location(LatLng(39.9042, 116.4074))
          .scale(1.0f)
          .build()
  )
  // 添加到地图样式
  mapboxMap.getStyle { style ->
      style.addSource(modelSource)
      style.addLayer(modelLayer)
  }
  

• OBJ格式处理：原生SDK没有直接的OBJ加载支持，建议先将OBJ转换为GLTF/GLB格式（可使用Blender等工具完成转换），再按上述方式集成。

iOS端实现方式 #

• 原生支持GLTF/GLB格式：使用MGLModelSource加载模型文件，配合MGLModelLayer添加到地图，指定位置和缩放参数即可渲染。
  示例代码片段：

  guard let modelURL = Bundle.main.url(forResource: "model", withExtension: "glb") else { return }
  // 创建模型数据源
  let modelSource = MGLModelSource(identifier: "custom-model-source", url: modelURL, options: nil)
  // 创建模型图层
  let modelLayer = MGLModelLayer(identifier: "custom-model-layer", source: modelSource)
  modelLayer.modelIdentifier = "model"
  modelLayer.position = CLLocationCoordinate2D(latitude: 39.9042, longitude: 116.4074)
  modelLayer.scale = 1.0
  // 添加到地图样式
  mapView.style?.addSource(modelSource)
  mapView.style?.addLayer(modelLayer)
  

• OBJ格式处理：同样建议转换为GLTF/GLB格式，或借助第三方3D渲染库（如SceneKit）加载OBJ后，再将渲染结果集成到Mapbox地图的自定义图层中。

你找到的GL JS示例是Web端的实现方案，移动端原生SDK有对应的专属API，核心逻辑都是通过模型数据源+图层的方式实现3D模型渲染，但API细节与Web端不同。

内容的提问来源于stack exchange，提问作者pallgeuer