CustomArrowBufferGeometry - Using CylinderBufferGeometry & ConeBufferGeometry

Resources
, ,
1

I have created CustomArrowBufferGeometry using CylinderBufferGeometry & ConeBufferGeometry.

Main reason behind this is we cannot change line thickness in THREE.ArrowHelper.

I have created geometry in such a way that if we can change line thickness and other properties using optionalParams.

If we are not passing optionalParams, It will create arrow using generating value of line thickness and other optionalParams from arrow length.

Here is sample video.

Code Example.

//arrow Direction
const dir = new THREE.Vector3(1, 1, 1);
//normalize the direction vector (convert to vector of length 1)
dir.normalize();

//arrow origin
const origin = new THREE.Vector3(0, 0, 0);
const length = 50;

//custom arrow
let optionalParams = {
    // //all params value is relative to length of arrow. 0 means 0% and 1 means 100%
    // cylLineRadius: 0.01, //0 to 0.05
    // coneLength: 0.5, //0 to 0.5
    // coneRadius: .05 //0 to 0.1
}
const geometry = new CustomArrowBufferGeometry(dir, origin, length, optionalParams)
1 Like