# Create line with same origin and different angle

Hello there,

I would like to create a new line based in other but with different angle.

I created a jsfiddle to understand good it. If you hold down button and move mouse you can create two lines. The red line is the mouse direction and I would like to set the blue line in other angle( for example 90) and the same size / origin. I try this but isn’t work

``````   //red line
const direction = new THREE.Vector3();
direction.subVectors( this.currentPosition, this.startPosition );
const anchorOne = new THREE.Vector3();
anchorOne.addVectors ( this.currentPosition, direction.multiplyScalar(1.5) );
//blue line
const cloneDir = direction.clone();
var axis = new THREE.Vector3( 0, 0, 0 );
var angle = THREE.Math.degToRad( 90 ) ;
cloneDir.applyAxisAngle( axis, angle );
``````

Any suggestion are welcome,
Thanks

``````var axis = new THREE.Vector3( 0, 0, 0 );
var angle = THREE.Math.degToRad( 90 ) ;
cloneDir.applyAxisAngle( axis, angle );
``````

This is correct, but you apply 90 degrees rotation to a zero-vector axis (an axis that is pointing in no direction, ie. there won’t be any rotation.)

You can render a vector rotated by 90 degrees using:

``````const cloneDir = new THREE.Vector3(direction.y, -direction.x, 0).add(this.currentPosition);
``````

Edit: If you didn’t mean just by 90, this should work for any angle:

``````let cloneDir = direction.clone();
cloneDir.applyAxisAngle( new THREE.Vector3(0, 0, 1), THREE.MathUtils.degToRad(45) );