Line cannot be rotated?

Questions
1

I have been trying to add rotation to the circle object with little luck, Doing a setRotationFromVector3 works, but is not correct. Any rotation I apply to the circle has a weird effect. What am I doing wrong here? I want the circles to be drawn on the flat axis.

I have tried to change the axis around which I rotate, but nothing seems to work. to fix the orientation of the circles. I wanted to create a planetary system where the sphere (later ellipses show their trajectory) All I need to do is rotate the circles 90 degrees but doing a rotateX, Y or Z does nothing…

image
image820×732 56.1 KB 

export class SolarBody extends THREE.Object3D {
    constructor(name: string, material: THREE.Material, distance: number = 0, scale: number = 1, initRotation: number = 0) {
        super();

        const shape = new THREE.IcosahedronBufferGeometry(scale, 1);
        const mesh = new THREE.Mesh(shape, material);

        const pivot = new Object3D();
        const newPos = new Vector3(distance, 0, 0);
        mesh.name = name;

        var curve = new THREE.EllipseCurve(0, 0, distance, distance, 0, 2 * Math.PI, false, 0);
        var circle = new THREE.Line(new THREE.BufferGeometry().setFromPoints(curve.getPoints(50)), new MeshBasicMaterial({ color: '#ffffff' }));

        mesh.position.set(newPos.x, newPos.y, newPos.z);
        pivot.add(mesh);
        this.add(pivot);
        this.add(circle);

        pivot.rotation.y = THREE.Math.degToRad(initRotation);
    }
}

Note that the class itself is created without an initial rotation

2

Hi!
Try this:

var circle = new THREE.Line(new THREE.BufferGeometry().setFromPoints(curve.getPoints(50)), new MeshBasicMaterial({ color: '#ffffff' }));
circle.geometry.rotateX(Math.PI * 0.5);
1 Like
3

I am god damn retarded, I legit forgot radians for PI are 180 degrees and not 90.

1 Like