How to update a point cloud based on real-time data?

The data is sent periodically through WebSocket and needs to be updated in real time。Here are some of the methods I called, but they can’t render in real time, what’s the problem?

const vtkPoints = vtkPoints.newInstance();
const vtkCells = vtkCellArray.newInstance();
const mapper = vtk.Rendering.Core.Mapper.newInstance();
const polydata = vtk.Common.DataModel.vtkPolyData.newInstance();
polydata.setPoints(vtkPoints);
polydata.setVerts(vtkCells);

setInterval(() => {
  // 
  const pointIndex = vtkPoints.insertNextPoint(Math.random(), Math.random(), Math.random());
  vtkCellArray.insertNextCell([pointIndex]);
  vtkPoints.modified();
  vtkCellArray.modified();
  polydata.modified();
  mapper.getInputData().modified();
  // render
  renderWindow.render();
}, 1000);

Do you have the following code snippet anywhere? (outside the setInterval)

actor.setMapper(mapper)
mapper.setInputData(polydata)
renderer.addActor(actor)

Yes, these codes have been written outside the code, here I only write the logical code of real-time refresh.

Hello, this is an example, can you help find the problem?

It is rendering but the new added points are out of clipping range, however, I have a question with this too, if the new points are too far from the original, it doese not performs as expected.

In your case you can change the new added to

this.onReceiveNewPoints([
    [83 + Math.random(), 460 + Math.random() *10, -347 - Math.random()],
    [83 + Math.random(), 460 + Math.random() * 10, -347 - Math.random()],
]);

And call this.renderer.resetCamera(), this.renderer.resetCameraClippingRange() before render() to see, but new points will still disappear sometimes when you rotate the camera, even if you add a custom bounds that involves the maximum and minimum bounds(e.g. [80, 90, 455, 475, -350, -340] in this case).

Thank you very much for your solution. After modifying the coordinates of the points, I can see the rendering effect. This problem does exist, and the newly added points may not be very close to the previous points.

Is anyone still concerned about this issue? The point cloud can be refreshed in real time, but some points will be cropped by the camera and will not be displayed.I’ve re-fetched the range of polydata and set the crop area of the camera.

const bounds = polyData.getBounds();

camera.setPosition([bounds[0] - (bounds[1] - bounds[0]) / 2, bounds[2] - (bounds[3] - bounds[2]) / 2, 1]);
camera.setFocalPoint([bounds[0] - (bounds[1] - bounds[0]) / 2, bounds[2] - (bounds[3] - bounds[2]) / 2, 0]);

renderer.resetCameraClippingRange();
renderer.resetCamera();

Try calling vtkPoints.dataChange() after inserting your new points. That should properly update the bounds.

If that works, then we’d need to investigate why inserting points isn’t properly updating the bounds.

1 Like

Thank you, after adding vtkPoints.dataChange(), I can get the new point cloud boundary, and I can see the newly added points.