Graphics Reference
In-Depth Information
this.faceVertexUvs =
boxGeometry.faceVertexUvs;
}
// define that FixedBoxGeometry
extends from
// THREE.Geometry
THREE.FixedBoxGeometry.prototype=
Object.create( THREE.Geometry.prototype );
}
In this function, we define a new JavaScript object using
THREE.FixedBoxGeometry = function ( width, segments)
{..}
. In this function, we first call the constructor of the parent object
(
THREE.Geometry.call( this )
). This makes sure that all properties
are correctly initialized. Next, we wrap an existing
THREE.BoxGeometry
object and use information from that object to set
vertices
,
faces
, and
faceVertexUvs
for our own custom object.
Finally, we need to tell JavaScript that our
THREE.BoxGeometry
object ex-
tends from
THREE.Geometry
. This is done by setting a prototype property
of
to
THREE.FixedBoxGeometry
Ob-
ject.create(THREE.Geometry.prototype)
.
2. After
setupCustomObject()
is called, we can now use the same ap-
proach to create this object like we do for the other Three.js-provided geo-
metries:
var cubeGeometry = new
THREE.FixedBoxGeometry(3, 5);
var cubeMaterial = new
THREE.MeshNormalMaterial();
var cube = new THREE.Mesh(cubeGeometry,
cubeMaterial);
scene.add(cube);
At this point, we've created a custom Three.js geometry that you can instan-
tiate just like the standard geometries provided by Three.js.