Skip to main content

Four city maps share one Deck through React Fiber's DeckCanvas: New York, London, Tokyo and Sydney each have their own presentation canvas, basemap style, landmarks, controller and zoom widget. Hovering updates shared React state. Sydney can be removed and re-added to demonstrate canvas cleanup.

This is a React port of deck.gl's multi-canvas cities example, using the DeckCanvas RFC.

Run the standalone application from the repository root:

yarn
yarn workspace example-react-fiber-multi-canvas start

Example source · DeckCanvas API

Each DeckCanvas contributes its views, layers and widgets props. The application owns the shared Deck and its view states. The example aliases local workspace sources and requires internet access for Carto tiles and fonts.