Some Objects (THREE.Line) rendered and some others not

Hello all,

I have a problem with THREE.Line rendering.
I create them with the same function and some are visible and others not.

F.e. The first two created lines are not renderend then the next ones yes.


I am using an Orthographic camera.

Create Line function:

function createLine(lineColor, point1, point2, lineName) {

    lineColor = parseInt(lineColor, 16);

    const material = new THREE.MeshBasicMaterial({

        color: lineColor

    });

    const points = [];

    const lineVert1 = point1.position;

    const lineVert2 = point2.position;

    points.push(lineVert1);

    points.push(lineVert2);

    const geometry = new THREE.BufferGeometry().setFromPoints(points);

    const line = new THREE.Line(geometry, material);

    line.name = lineName;

    line.traverse((el) => { el.frustumCulled = false; });

    return line;

}

I have already tried to set frustumCulled as true.

Please demonstrate the issue with a live example. I’ve already added most of your code here:

https://jsfiddle.net/5gs0jdxm/2/