I am trying to turn on the wireframe on for a vti file but vtkVolumeProperty doesn’t seem to provide the option to setRepresentationToWireframe(), therefore I would like to render the image using the classic vtkmapper and vtkactor so I can turn that on. However,I don’t know if vtk.js allows that? If it doesn’t is there any workaround for it.
Volumes don’t have wireframes; geometry does. The basic “wireframe” for an image would be the outline of a rectangular prism that bounds the volume; see vtkOutlineFilter.
What I am looking for is to show the structured grid and overlay that on top of the colors. I will look at the the outline filter. since image data is just a structured grid, I was just hoping to show the grid as well as the volume. When I do iso-values with my vti file, because of the image marching cube mapper, I am able to apply a regular actor to it and show the grid structure at each iso-slice. I am just trying to do that with the whole volume instead of each individual slice
So if I’m understanding you correctly, you want an outline + structured grid lines. We currently don’t have that, but it should be easy to generate. The basic idea is to generate grid points for each face of your volume, and then connect them with lines. (Let me know if you have trouble with this.) Though if you have a large image, the grid might start getting in the way of your visualization…
yep that’s exactly what I want. and the image isn’t huge I just need some help on creating the lines. I am pretty sure I just make the image grid only but I don’t how I would draw the lines.
To construct lines in polydata, you use the lines cell array in the vtkPolyData object. Something like this:
const lines = [2, p1, p2, 2, p3, p4, ...];
polyData.getLines().setData(lines);
The format of lines is for every line, you start with the number “2” (since lines consist of two points) and then two indices of your line points in your points array. (Example: if you have a points array of [1,0,0,0,1,0], then index 0 will be the point (1,0,0), and index 1 will be the point (0,1,0)).
Okay since it’s image data and the grid is pretty much structured. I can build the points myself using the origin, extent and spacing. My thought is to create a new polydata instance and then loop through to create the lines and then follow what you set set the new polydata instance to the lines. my question is volumes have internal areas but polydata doesn’t render internal areas so do I just need to create the lines for the 6 faces?
Yep, my understanding would be you have your 3D grid of lines, with lines for the face outlines of your volume.
1 Like
I tried to just do a single line for testing purposes, here are the points and the lines
const lines = [2,[0,0,0],[1,0,0], 2,[1,0,0], [2,0,0],2,[2,0,0],[3,0,0], 2,[3,0,0], [0,0,0]]
const points = [0,0,0,1,0,0,2,0,0,3,0,0];
const poly = vtkPolyData.newInstance();
poly.getLines().setData(lines);
poly.getPoints().setData(points, 3);
poly.computeBounds();
poly.buildCells();
mapper.setInputData(poly);
actor.setMapper(mapper);
renderWindow.render();
I can’t see anything on my screen however I know the points are there because I ran the poly through a spheremapper and I could see the points created by the sphere actor. Is there just something trivial that I am missing when I render the poly?
Ah, the lines array should be using point indices, not point arrays. Here is a more illuminating example:
const lines = [
2, 0, 1, // connect points 0, 1
2, 1, 2, // connect points 1, 2
2, 2, 3, // connect points 2, 3
2, 3, 4, // connect points 3, 4
2, 4, 5, // connect points 4, 5
];
const points = [
0, 0, 0, // index 0
1, 0, 0, // index 1
1, 1, 0, // index 2
0, 0, 1, // index 3
1, 0, 1, // index 4
1, 1, 1, // index 5
];
Replace your points and lines array with the above to see the result.
Yep that was the issue. I should have know that it would be in the same format as the data files but thank you!