Hello everyone, I attempted to use cubes instead of pixels to render the ply file, but the actual rendering result did not meet my expectations. Could it be that I used a wrong part? Here is my code:
<template>
<div class="point-cloud-cube" ref="container"></div>
</template>
<script>
import '@kitware/vtk.js/Rendering/Profiles/Geometry';
import vtkFullScreenRenderWindow from '@kitware/vtk.js/Rendering/Misc/FullScreenRenderWindow';
import vtkPLYReader from '@kitware/vtk.js/IO/Geometry/PLYReader';
import vtkCubeSource from '@kitware/vtk.js/Filters/Sources/CubeSource';
import vtkGlyph3DMapper from '@kitware/vtk.js/Rendering/Core/Glyph3DMapper';
import vtkActor from '@kitware/vtk.js/Rendering/Core/Actor';
import { onMounted, onUnmounted, ref } from 'vue';
export default {
name: 'CubeRender',
setup() {
const container = ref(null);
let fullScreenRenderer = null;
onMounted(async () => {
fullScreenRenderer = vtkFullScreenRenderWindow.newInstance({
container: container.value,
background: [0.1, 0.1, 0.1],
});
const renderer = fullScreenRenderer.getRenderer();
const renderWindow = fullScreenRenderer.getRenderWindow();
const reader = vtkPLYReader.newInstance();
await reader.setUrl('/random_points.ply');
const cubeSource = vtkCubeSource.newInstance({
xLength: 10,
yLength: 10,
zLength: 10,
});
const glyphMapper = vtkGlyph3DMapper.newInstance();
glyphMapper.setInputConnection(reader.getOutputPort(), 0);
glyphMapper.setInputConnection(cubeSource.getOutputPort(), 1);
const actor = vtkActor.newInstance();
actor.setMapper(glyphMapper);
renderer.addActor(actor);
renderer.resetCamera();
renderWindow.render();
});
onUnmounted(() => {
if (fullScreenRenderer) {
fullScreenRenderer.delete();
}
});
return { container };
},
};
</script>
<style>
.point-cloud-cube {
width: 100%;
height: 100vh;
}
</style>
