React component for the Procedural GL JS library

Jan 22, 2021
React component for the Procedural GL JS library

Procedural GL React component

Procedural GL JS is a library for creating 3D map experiences on the web, written in JavaScript and WebGL. It is built on top of THREE.js.

It provides an easy-to-use, but powerful framework to allow beautiful landscapes of the outdoors to be embedded into web pages. It loads super-fast and is optimized for mobile devices.

View Demo View Github

React component

This repository contains a React wrapper for the library allowing it to be easily included into projects built with React.


This component does not bundle React, nor Procedural GL JS but instead expects them as peer dependencies. As such you will need to install them if they are not part of your project already.

npm install react npm install react-dom npm install procedural-gl npm install procedural-gl-react


import ProceduralMap from 'procedural-gl-react'; // Configure library as usual (see main project) <ProceduralMap datasource={datasource} compassVisible={true} displayLocation={{ latitude: 47.5, longitude: 13.55 }}/>


An more complete example of how to integrate this library with React can be found here.