Integration with/docs on react-three-fiber

[bergkvist]

Right now, we have:

imperative	declarative (react)
Mapbox GL JS	react-map-gl
THREE.js	react-three-fiber

Just as react-map-gl is the declarative react(ion) to Mapbox GL JS, react-three-fiber is the declarative reaction to THREE.js.

Mapbox GL JS has support for adding custom layers with THREE.js:
https://docs.mapbox.com/mapbox-gl-js/example/add-3d-model/

It would be really cool with some examples/documentation on how react-map-gl could be used together with react-three-fiber.

Imagine being able to easily add a postprocessing effect to the map

function App() {
  return (
    <Canvas>
      <ReactMapGL />
      <BookehPostprocessingEffect />
    </Canvas>
  )
}

Or adding a custom 3d object

function App() {
  return (
    <Canvas>
      <ReactMapGL />
      <Custom3DObject />
    </Canvas>
  )
}

[ibgreen]

react-map-gl is designed to work seamlessly with deck.gl (which by the way does support GPU based post processing effects).

That said, if someone contributed good example on how to integrate with other 3D/WebGL libraries, I am sure it would be appreciated, but it would not be a priority for current maintainers.