CODEWITHSUNDEEP
3dthree.jswebglshapes
MeTe-30
MeTe-30

Reputation: 2542

THREE.JS create custom 3D shape

How can I create the shape below with THREE.JS in WebGLRenderer.

Image of required shape

This shape is a cube, the top face of which has been rotated 45 degrees.
Is it possible to create the cube then change it vertexes or ...
any idea?

Upvotes: 4

Views: 3596

Answers (1)

chaindriver
chaindriver

Reputation: 892

You can access the vertex positions using the array cubeMesh.geometry.vertices.

//create a cube as per usual
var cubeMesh = new THREE.Mesh(
    new THREE.CubeGeometry(1, 2, 1),
    new THREE.MeshLambertMaterial()
);
scene.add(cubeMesh);

//change vertex positions
cubeMesh.geometry.vertices[1].y += 1;
cubeMesh.geometry.vertices[4].y += 1;

//indicate that the vertices need update
cubeMesh.geometry.verticesNeedUpdate = true;

Upvotes: 8

Related Questions