CODEWITHSUNDEEP
javascriptthree.js
Beth
Beth

Reputation: 51

How to set height of extrusion in three.js?

I'm using the following code to make a trapezoid shape. I need to extrude this geometry to a specific height (2800), but I can't seem to figure out where to set the height parameter. Any ideas?

//Walls

var wallPoints = [[0,0,0],
                  [0,1000,0],
                  [-100,1100,0],
                  [-100,-100,0],
                  [0,0,0]];

var Vector3WallPoints = [];

for (var i=0;i<wallPoints.length;i++)
{ 
Vector3WallPoints.push(new THREE.Vector3(wallPoints[i][0],wallPoints[i][1],wallPoints[i][2]));
}

var wallShape = new THREE.Shape( Vector3WallPoints );

var extrusionSettings = {
    amount: 1000,
    //size: 300, height: 400, curveSegments: 3,
    //bevelThickness: 10, bevelSize: 20, bevelEnabled: false,
    material: 0, extrudeMaterial: 1, amount: 100,
    };

    var wallGeometry = new THREE.ExtrudeGeometry( wallShape, extrusionSettings );                           

    var materialFront = new THREE.MeshBasicMaterial( { color: 0xffffff } );
    var materialSide = new THREE.MeshBasicMaterial( { color: 0xff8800 } );
    var materialArray = [ materialFront, materialSide ];
    var wallMaterial = new THREE.MeshFaceMaterial(materialArray);

    var walls = new THREE.Mesh( wallGeometry, wallMaterial );

    scene.add(walls);

Upvotes: 1

Views: 587

Answers (1)

Alex Wayne
Alex Wayne

Reputation: 187014

You're setting amount twice in the same object. If you are setting the first one, the other one is overriding it. Remove one of those and it should do what you expect.

var extrusionSettings = {
    amount: 1000,
    material: 0, extrudeMaterial: 1, amount: 100, // <-- whoops
};

Assuming you are using the THREE.js api properly here, I'm not 100% of that myself.

Upvotes: 1

Related Questions