On this page

Add a 3D model to globe using MapTiler 3D JS

This example shows how to add a 3D model to globe using MapTiler 3D JS module. The 3D JS module enables you to integrate multiple 3D objects onto the globe surface. You can adjust model sizes, create duplicates, position models at specific elevations above sea level, and more. This offers complete flexibility in manipulating your 3D models.

NPM module
Basic JavaScript

plane a340 by mamont nikita is licensed under Creative Commons Attribution
COLLADA duck One texture Credit: © 2006, Sony. SCEA Shared Source License, Version 1.0

↩

Projection control how to toggle the map between mercator and globe projection

Projection control (globe)

Toggle between Mercator and globe projections using map controls.

Create a globe map with ocean bathymetry terrain elevation

Globe with ocean bathymetry

Display ocean bathymetry and terrain elevation on 3D globe.

Add multiple 3D models to the map

Add multiple 3D models

Incorporate multiple 3D models with adjustable parameters on maps.

Animate a 3D plane flight in a globe using MapTiler 3D JS

Animate a 3D plane flight in a globe

Animate airplane flight paths using 3D models on globe.

An extension of MapLibre GL JS

Was this helpful?