Graphics Reference
In-Depth Information
How to do it...
To set up the WebGL renderer, you will follow exactly the same steps as we showed
in the previous recipe,
Getting started with the WebGL renderer
, so we won't go into
the details in this section but we'll just list down the differences:
1. To get started with the
THREE.CanvasRenderer
object, the only thing we
need to change is the following:
• Replace the
THREE.WebGLRenderer
object in the following piece of
code:
renderer = new
THREE.WebGLRenderer();
renderer.setClearColor(0x000000,
1.0);
renderer.setSize(window.innerWidth,
window.innerHeight);
• Replace
the
THREE.WebGLRenderer
object
with
the
THREE.CanvasRenderer
object as follows:
renderer = new
THREE.CanvasRenderer();
renderer.setClearColor(0x000000,
1.0);
renderer.setSize(window.innerWidth,
window.innerHeight);
And that's it. With this change, we move from rendering using WebGL to rendering
on the HTML5 canvas.
