I followed the documentation for displaying a 3D Puck but it is not showing. Already tried with another .gltf, .glb or even a .usdz but still no luck. File is imported correctly too.
The puck does show if I change the .puckType to a .puck2D().
Fatal Error does not get called so MapBox is getting the model successfully, and the file does not have any errors.
Also tried changing the modelScale but no luck. As well as modelOpacity or orientation.
class MapViewController: UIViewController {
var mapView: MapView!
private var cancelables = Set<AnyCancelable>()
override func viewDidLoad() {
super.viewDidLoad()
let options = MapInitOptions()
mapView = MapView(frame: view.bounds, mapInitOptions: options)
mapView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
view.addSubview(mapView)
mapView.mapboxMap.onStyleLoaded.observeNext { _ in
self.configureMapView()
}.store(in: &cancelables)
setupGestureRecognizers()
}
private func configureMapView() {
// Fetch the asset
guard let uri = Bundle.main.url(forResource: "truck", withExtension: "gltf") else {
fatalError("Failed to locate glb model in asset catalog")
}
// Instantiate the model
let myModel = Model(uri: uri, orientation: [0, 0, 180])
let configuration = Puck3DConfiguration(
model: myModel,
modelScale: .constant([10, 10, 10])
)
mapView.location.options.puckType = .puck3D(configuration)
mapView.location.options.puckBearing = .course
mapView.location.options.puckBearingEnabled = true
mapView.location.onLocationChange.observeNext { [weak mapView] newLocation in
guard let location = newLocation.last, let mapView else { return }
mapView.camera.ease(
to: CameraOptions(
center: location.coordinate,
zoom: 15,
bearing: 0,
pitch: 55),
duration: 1,
curve: .linear,
completion: nil
)
}.store(in: &cancelables)
}
}
1 Answer 1
After a day trying to fix this the resource loaded after importing the .bin file and changing the scale for the model since it may be too small too see or display at first.
MapBox works a little weird regarding 3D objects so don't be surprised if it (believe it or not) magically renders the model after some hours and you haven't change anything in the code.
My suggestions for working with this would be:
- Making sure the model you're importing is compatible and valid. See https://github.khronos.org/glTF-Validator/
- Checking the logs for any hint at what's going on.
- Playing with different
modelScale - Trying with different
.gltf - Cleaning build folder
- Or just the IT guy solution: Restart and try again.
I also suggest asking in the MapBox discord, there are many employees there that could also help you out.