CODEWITHSUNDEEP
javascriptthree.js
spc16670
spc16670

Reputation: 584

Can I use THREE js ExtrudeGeometry to extrude a shape over a sharp path?

I have used CatmullRomCurve3 to extrude over a curved line. Is it possible to extrude over a sharp line like below:

enter image description here

What I want to have is:

enter image description here

With possibly as few polygons as possible.

Upvotes: 1

Views: 4273

Answers (2)

spc16670
spc16670

Reputation: 584

I ended up creating vertices, faces and calculating UVs myself. For anyone wanting to do something similar this helped me a lot. I still do not know if ExtrudeGeometry could have been used here.

Upvotes: 0

Liam Magee
Liam Magee

Reputation: 21

There are a number of ways you could create a geometry of steps, but to do so using ExtrudeGeometry, you could do something like:

var shape = new THREE.Shape();
shape.moveTo( 0, 0 );
var numSteps = 10, stepSize = 10;

for ( var i = 0; i < numSteps; i ++ ) {

    shape.lineTo( i * stepSize, ( i + 1 ) * stepSize );
    shape.lineTo( ( i + 1 ) * stepSize, ( i + 1 ) * stepSize );

}

var extrudeSettings = { amount: 100, bevelEnabled: false };
var geometry = new THREE.ExtrudeGeometry( shape, extrudeSettings );

var material = new THREE.MeshBasicMaterial( {color: 0xffffff } );
var steps = new THREE.Mesh( geometry, material );

For a full example based on webgl_geometry_extrude_shapes2, see below:

http://jsfiddle.net/cc146hcx/

Upvotes: 2

Related Questions