An error is reported when using the setPositions method in geometry to set the position of line2

[fukuin]

i have a lot of lines, and the effect I want to achieve is to make them thicker and change color when the mouse touches them.

My code:

// ...

// when creating a scene
let line_g = new LineGeometry();
let mat = new LineMaterial({
    linewidth: 2.5,
    color: 0x00ff00,
});
mat.resolution.set(containerRect.width, containerRect.height);
this.highLightLine = new Line2(line_g, mat);
this.scene.add(this.highLightLine);
//...

// when the mouse gets the position of the line
this.highLightLine.geometry.setPositions(   
    this.scene.linesList[edgeIndices[0]].vertex_coord
);

I instantiate a line2 when creating a scene, get the point array of the line when the mouse picks up the line, and use the setPositions method to give it to the previously created line2, but this will report the following error

Error:

THREE.LineSegmentsGeometry.computeBoundingSphere(): 
    Computed radius is NaN. The instanced position data is likely to have NaN values

if i write them together like this, it can be displayed normally.

let line_g = new LineGeometry();
line_g.setPositions(
    this.scene.linesList[edgeIndices[0]].vertex_coord
);
let mat = new LineMaterial({
    linewidth: 2.5,
    color: 0x00ff00,
});

mat.resolution.set(containerRect.width, containerRect.height);
this.highLightLine = new Line2(line_g, mat);
this.scene.add(this.highLightLine);

[Mugen87]

I think Line2 was not developed with the use case in mind that you render it without a valid definition of the line segments position.

As a workaround, can’t you just add the line to the scene as soon as you call setPositions()?

[fukuin]

I gave a position when created line2, and then called the setPositions method and the visible property later

    let line_g = new LineGeometry();
    line_g.setPositions([0, 0, 0, 100, 100, 100]);
    let mat = new LineMaterial({
      linewidth: 2.5,
      color: 0x00ff00,
    });
    mat.resolution.set(containerRect.width, containerRect.height);
    this.highLightLine = new Line2(line_g, mat);   
    this.scene.add(this.highLightLine);
    this.highLightLine.visible = false;
    .
    .
    .
    // when the mouse gets the position of the line
    this.highLightLine.geometry.setPositions(
       this.scene.linesList[edgeIndices[0]].vertex_coord
    );
    this.highLightLine.visible = true;

After I have modified it like this, still sometimes report the previous error. And most of the lines only show a small part of them. But there are some that can be displayed correctly.

should be:

but:

I’m sure the data for points is correct

How can I avoid this from happening?

[fukuin]

@ Mugen87