Change/switch Renderer's dynamically at runtime

[SrinivasPrabhu794]

As an extension to the answer below which changes the renderer at startup:
#1908 (comment)

I would like to know how do we change the renderer dynamically at runtime?

For example, We want to switch between WebglRenderer/ CSSRenderer back and forth to render the same scene. Is that possible? If so so how do we go about doing it?

[drcmda]

You can key the canvas

[SrinivasPrabhu794]

@drcmda Could you elaborate what you mean by that ?

[drcmda]

<Canvas key={renderer} gl={canvas => {
  if (renderer === "foo") return new FooRenderer({ canvas, this, that })
  else if (renderer === "bar") return new BarRenderer({ canvas, this, that })
}}>

[SrinivasPrabhu794]

Hi @drcmda, thanks for your prompt reply. This really helps. In the above case, how do I access the canvas at runtime to change its key ?