3d-tiles-renderer
May 22, 2026 · View on GitHub
JavaScript renderer implementation for the 3D Tiles format with support for both Three.js and Babylon.js. The renderer supports most of the 3D Tiles spec features with a few exceptions. For a list of available data sets and generation tools see the 3d Tiles resources list.
If a tileset or geometry does not load or render properly please make an issue! Example data is needed for adding and testing features. See the Feature Complete Milestone for information on which features are not yet implemented.
Getting Started
Installation
npm install 3d-tiles-renderer --save
API
| Package | Reference |
|---|---|
3d-tiles-renderer/core | API Reference |
3d-tiles-renderer/three | Usage Guide · API Reference |
3d-tiles-renderer/babylonjs | Usage Guide · API Reference |
3d-tiles-renderer/r3f | Usage Guide · API Reference |
Plugins
| Package | Reference |
|---|---|
3d-tiles-renderer/three/plugins | Plugin Guide · API Reference |
3d-tiles-renderer/core/plugins | API Reference |
Examples
The following examples use Three.js. Babylon.js demos are also available for Mars and Google Photorealistic Tiles.
See the Three.js usage guide or Babylon.js usage guide for setup details with each engine.
| Example | Description |
|---|---|
| Core | |
| Dingo Gap Mars | Multiple tilesets |
| Kitchen Sink | All options and features |
| VR | Rendering in VR |
| External Tiles Providers ¹ | |
| Cesium Ion 3D Tiles | Standard Cesium Ion tileset |
| Cesium Ion Lunar | Lunar surface tiles |
| Cesium Ion Mars | Mars surface tiles |
| Google Photorealistic | Google Photorealistic Tiles |
| Google Globe | Google Globe Tiles |
| Customization | |
| Custom Material | Using a custom material |
| Offscreen Shadows | Shadows from offscreen tiles |
| Texture Overlays | Alternate texture overlays |
| Plugins | |
| Metadata | Tile metadata |
| Fade Transition | Tile LoD fade transition |
| Deep Zoom | Deep Zoom Image format |
| TMS / XYZ | TMS, XYZ map tiles |
| WMTS | WMTS map tiles |
| WMS | WMS map tiles |
| Quantized Mesh | Quantized mesh with overlays |
| Load Region | Loading tiles in region volumes |
| GeoJSON | GeoJSON overlays |
| Vector Tiles | Mapbox Vector Tiles and Protomap Tiles overlays |
¹ Requires a Google Tiles API Key or Cesium Ion API Key
Community Resources
Here is a reference to existing 3DTilesRendererJS integrations:
- three-geospatial: Clouds and atmosphere rendering via a three.js geospatial rendering modules, alongside 3DTilesRendererJS.
- 3D Tiles in MapLibre Guide: Official example showing how to render 3D tiles using a synced Three.js layer.
- Giro3D: Framework for visualizing and interacting with heterogenous geospatial data in the browser, 2D, 2.5D and 3D data.
- iTowns: Framework designed for the efficient visualization, navigation, and interaction with 2D and 3D geospatial data on the web.
- threepipe Plugin: Plugin for the threepipe rendering framework integrating 3DTilesRendererJS.
- 3DBAG Viewer: Web viewer for the 3DBAG dataset, a nationwide 3D model of all buildings in the Netherlands built with roofer.
- Babylon.js Guide: Official documention on integrating 3DTilesRendererJS into your Babylon.js project.
- Community Plugins: Additional community-maintained threejs plugins for 3DTilesRendererJS.
LICENSE
The software is available under the Apache V2.0 license.
Copyright © 2020 California Institute of Technology. ALL RIGHTS RESERVED. United States Government Sponsorship Acknowledged. Neither the name of Caltech nor its operating division, the Jet Propulsion Laboratory, nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.