Skip to content
Caven Chen edited this page Dec 9, 2024 · 7 revisions

maplibre-three-plugin is a bridge plugin that cleverly connects MapLibre GL JS with Three.js, enabling developers to implement 3D rendering and animation on maps.

Install

npm install @dvgis/maplibre-three-plugin
----------------------------------------
yarn add @dvgis/maplibre-three-plugin

Quickly Start

maplibre-three-plugin depends on three, please make sure three is installed before using it.

import maplibregl from 'maplibre-gl'
import 'maplibre-gl/dist/maplibre-gl.css'
import { MapScene } from '@dvgis/maplibre-three-plugin'

const map = new maplibregl.Map({
  container: 'map', // container id
  style: 'https://demotiles.maplibre.org/style.json', // style URL
  center: [0, 0], // starting position [lng, lat]
  zoom: 1, // starting zoom
})
const mapScene = new MapScene(map)
Clone this wiki locally