Graphics Reference
In-Depth Information
How to do it...
Adding this functionality to your scene only takes a couple of small steps, which are
as follows:
1. Firstly, we have to create the
stats
object and position it. For this, we create
a simple function:
function createStats() {
var stats = new Stats();
stats.setMode(0);
stats.domElement.style.position =
'absolute';
stats.domElement.style.left = '0';
stats.domElement.style.top = '0';
return stats;
}
We create the statistics object by calling
new Stats()
. The
Stats.js
lib-
rary supports two different modes that we can set with the
setMode
function.
If we pass
0
as an argument, you see the frames rendered in the last second,
and if we set the mode to
1
, we see the milliseconds that were needed to
render the last frame. For this recipe, we want to see the framerate, so we
set the mode to
0
.
2. Now that we can create the statistics object, we need to append the
init
method we've seen in the skeleton recipes:
// global variables
var renderer;
var scene;
var camera;
var stats;
function init() {
