VTK.JS Setting CubeSource Edge Width and Color

Web
1

Hi, I’m a newbie to image rendering and to vtk.js. I was trying the inbuilt VolumeViewer example and after some efforts was able to run it. Now, I’m creating a bounding box at required position in the the vti file rendered. I read online and concluded that CubeSource will help me.

I created the cube. But unable to set the edge width. The lines are too thin to be clearly visible. I used LineWidth function but it doesn’t changes anything.

I also set the edge color. But the edge color is only visible when the cube is filled. If I set the cube to WireFrame mode, the edge color is not properly shown.

Can someone guide me further.

Thanks and Regards
Vishal

2

AFAIK line width is inconsistent in webgl, so by extension line width won’t do much in vtk.js. @ken-martin may have more details.

As for the edge color, I suspect that may be having to do with polygon edges. If you want the wireframe to change color, maybe set the color of the actor directly, e.g. actor.setColor(...).

1 Like
3

Line width is not defined very well in the webgl spec.

Here is the topic:

1 Like
4

I had the same question here: Thicker lines on Cube and/or applying TubeFilter to CubeSource?

It seems like this feature does not exist in vtk.js at this moment, unfortunately :frowning:

I was somewhat able to work around it for my use case by defining a fill color and setting the opacity low so instead of a wireframe of a cube, it’s a lightly colored, semi-transparent cube.

  cubeActor.getProperty().setColor(0, 1, 0);
  cubeActor.getProperty().setOpacity(0.15);
1 Like
5

Thanks @Donny_Zimmerman. As per that topic, people have tried other data source for the way around. Will try that.

6

Thanks @anonymous_iguana. I had tried doing that. I am drawing the cube over a volume file to highlight a particular object in it. Even after setting the transparency my base object was not clearly visible after filling the cube with color. Still looking into it.

7

Thanks @Forrest. I tried setting color for actor but getting same response.

8

Coloring wireframe edges should just be a call to setColor:

pipeline.actor.getProperty().setColor(1, 1, 0); // yellow
pipeline.actor.getProperty().setRepresentation(1); // wireframe representation constant

See this example: edge coloring - CodeSandbox

9

Yup, that was pretty much the same case for me except that my object likely has enough contrast to be able to be seen even with a mostly-transparent cube over it. Sorry to hear that it isn’t for you. I wish there was a compromise between the semi-opaque cube and the very thin outline!

10

@Forrest I initially setting the edge color when cube was solid and it was working. Then I switched to wireframe and the edge color was not working. But the color was setting the edge color too. So, it’s kind of working.

11

@anonymous_iguana I achieved it using the TubeSource. I created a TubeSource with PolyData and manually created a cube. There I can set the tube diameter which is not setting the edge thickness. Just the corners are not so good. But for now it will work.

1 Like
12

A bit late, but regarding the cube line color you should be able to get a workaround by changing the interpolation type of its actor actor.getProperty().setInterpolationToFlat()

13

@miguel will try that out once get chance again to work on it :relieved:

1 Like