# VTK.JS Setting CubeSource Edge Width and Color
**URL:** https://discourse.vtk.org/t/vtk-js-setting-cubesource-edge-width-and-color/7187
**Category:** Web
**Created:** [November 16, 2021, 7:35am UTC](https://discourse.vtk.org/t/vtk-js-setting-cubesource-edge-width-and-color/7187 "2021-11-16T07:35:27Z")
**Posts on this page:** 13
**Page:** 1
### Author:  [@simplyvish](https://discourse.vtk.org/u/simplyvish)
#### Post date: [November 16, 2021, 7:35am UTC](https://discourse.vtk.org/t/vtk-js-setting-cubesource-edge-width-and-color/7187/1 "2021-11-16T07:35:27Z")
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
---
### Author:  [@Forrest](https://discourse.vtk.org/u/Forrest)
#### Post date: [November 16, 2021, 7:14pm UTC](https://discourse.vtk.org/t/vtk-js-setting-cubesource-edge-width-and-color/7187/2 "2021-11-16T19:14:28Z")
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(...)`.
---
### Author:  [@Donny\_Zimmerman](https://discourse.vtk.org/u/Donny_Zimmerman)
#### Post date: [November 16, 2021, 8:02pm UTC](https://discourse.vtk.org/t/vtk-js-setting-cubesource-edge-width-and-color/7187/3 "2021-11-16T20:02:00Z")
Line width is not defined very well in the webgl spec.
Here is the topic:
> [@\[vtk.js\] LineWidth with vtkLineSource](https://discourse.vtk.org/t/vtk-js-linewidth-with-vtklinesource/4173):
>
> I am currently unable to adjust the line width of an actor with vtkLineSource. Is there something I am missing? Are there perhaps no line cells? (psuedo-ish code) lineSource = vtkLineSource.newInstance(); lineActor = vtkActor.newInstance(); mapper = vtkMapper.newInstance(); lineActor.setMapper(mapper); mapper.setInputConnection(lineSource.getOutputPort()); lineSource.setPoint1(...) lineSource.setPoint2(...) then try to set the line width on the actor p = lineActor.getProperty() p.setLineWid…
---
### Author:  [@anonymous\_iguana](https://discourse.vtk.org/u/anonymous_iguana)
#### Post date: [November 16, 2021, 8:12pm UTC](https://discourse.vtk.org/t/vtk-js-setting-cubesource-edge-width-and-color/7187/4 "2021-11-16T20:12:39Z")
I had the same question here: [Thicker lines on Cube and/or applying TubeFilter to CubeSource?](https://discourse.vtk.org/t/thicker-lines-on-cube-and-or-applying-tubefilter-to-cubesource/6727)
It seems like this feature does not exist in vtk.js at this moment, unfortunately ☹
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.
```auto
cubeActor.getProperty().setColor(0, 1, 0);
cubeActor.getProperty().setOpacity(0.15);
```
---
### Author:  [@simplyvish](https://discourse.vtk.org/u/simplyvish)
#### Post date: [November 17, 2021, 3:57am UTC](https://discourse.vtk.org/t/vtk-js-setting-cubesource-edge-width-and-color/7187/5 "2021-11-17T03:57:00Z")
Thanks @Donny_Zimmerman. As per that topic, people have tried other data source for the way around. Will try that.
---
### Author:  [@simplyvish](https://discourse.vtk.org/u/simplyvish)
#### Post date: [November 17, 2021, 4:00am UTC](https://discourse.vtk.org/t/vtk-js-setting-cubesource-edge-width-and-color/7187/6 "2021-11-17T04:00:16Z")
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.
---
### Author:  [@simplyvish](https://discourse.vtk.org/u/simplyvish)
#### Post date: [November 17, 2021, 4:02am UTC](https://discourse.vtk.org/t/vtk-js-setting-cubesource-edge-width-and-color/7187/7 "2021-11-17T04:02:26Z")
Thanks @Forrest. I tried setting color for actor but getting same response.
---
### Author:  [@Forrest](https://discourse.vtk.org/u/Forrest)
#### Post date: [November 22, 2021, 6:19pm UTC](https://discourse.vtk.org/t/vtk-js-setting-cubesource-edge-width-and-color/7187/8 "2021-11-22T18:19:34Z")
Coloring wireframe edges should just be a call to `setColor`:
```auto
pipeline.actor.getProperty().setColor(1, 1, 0); // yellow
pipeline.actor.getProperty().setRepresentation(1); // wireframe representation constant
```
See this example: [edge coloring - CodeSandbox](https://codesandbox.io/s/edge-coloring-c7j6v?file=/src/index.js)
---
### Author:  [@anonymous\_iguana](https://discourse.vtk.org/u/anonymous_iguana)
#### Post date: [November 22, 2021, 7:37pm UTC](https://discourse.vtk.org/t/vtk-js-setting-cubesource-edge-width-and-color/7187/9 "2021-11-22T19:37:39Z")
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!
---
### Author:  [@simplyvish](https://discourse.vtk.org/u/simplyvish)
#### Post date: [November 23, 2021, 5:58am UTC](https://discourse.vtk.org/t/vtk-js-setting-cubesource-edge-width-and-color/7187/10 "2021-11-23T05:58:14Z")
@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.
---
### Author:  [@simplyvish](https://discourse.vtk.org/u/simplyvish)
#### Post date: [November 23, 2021, 6:00am UTC](https://discourse.vtk.org/t/vtk-js-setting-cubesource-edge-width-and-color/7187/11 "2021-11-23T06:00:35Z")
@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.
---
### Author:  [@miguel](https://discourse.vtk.org/u/miguel)
#### Post date: [September 7, 2022, 3:43pm UTC](https://discourse.vtk.org/t/vtk-js-setting-cubesource-edge-width-and-color/7187/12 "2022-09-07T15:43:48Z")
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()`
---
### Author:  [@simplyvish](https://discourse.vtk.org/u/simplyvish)
#### Post date: [October 1, 2022, 4:49am UTC](https://discourse.vtk.org/t/vtk-js-setting-cubesource-edge-width-and-color/7187/13 "2022-10-01T04:49:34Z")
@miguel will try that out once get chance again to work on it 😌