# Volume opacity

**URL:** https://discourse.vtk.org/t/volume-opacity/12123
**Category:** Web
**Created:** [August 9, 2023, 10:29am UTC](https://discourse.vtk.org/t/volume-opacity/12123 "2023-08-09T10:29:37Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![Xoz](https://discourse.vtk.org/user_avatar/discourse.vtk.org/xoz/32/5714_2.png) [@Xoz](https://discourse.vtk.org/u/Xoz)
#### Post date: [August 9, 2023, 10:29am UTC](https://discourse.vtk.org/t/volume-opacity/12123/1 "2023-08-09T10:29:37Z")

</div>

Hi everyone,

I’ve met a problem when trying to change the volume opacity, see these pics:  
 ![poly_opacity_1](https://discourse.vtk.org/uploads/default/original/2X/c/c77d1153441ae15580272850d91adfabcd69ca43.png)

![poly_opacity_0.5](https://discourse.vtk.org/uploads/default/original/2X/8/8cc9911834ef1576630c84645a26381ccecd4d64.png)

![poly_opacity_0](https://discourse.vtk.org/uploads/default/original/2X/7/7241be26a57f6ed25e43eec16089c6f24c7ad55e.png)

When a volume is placed in a same renderer with a polyData actor and is applied an RGBTransferFunction and a PiecewiseFunction.

If I change the opacity of the actor by calling actor.getProperty().setOpacity(number), part of the overlapping part of the volume becomes invisible, seems like that part did not join the opacity test, looks similar to the situation that the blend is disabled and depth test is enabled.

Is there anyway I can do to change this behavior? The expected result should be that the part of the volume is visible.

Regards

---

<div class="post-metadata">

### Author: ![finetjul](https://discourse.vtk.org/user_avatar/discourse.vtk.org/finetjul/32/154_2.png) [@finetjul](https://discourse.vtk.org/u/finetjul)
#### Post date: [August 9, 2023, 11:23am UTC](https://discourse.vtk.org/t/volume-opacity/12123/2 "2023-08-09T11:23:30Z")

</div>

What you want to achieve can only be done with a DepthPeeling technique however it has not been implemented yet in VTK.js.

It would be a great feature to add indeed. We would be happy to help you with the implementation of such feature.

---

<div class="post-metadata">

### Author: ![Xoz](https://discourse.vtk.org/user_avatar/discourse.vtk.org/xoz/32/5714_2.png) [@Xoz](https://discourse.vtk.org/u/Xoz)
#### Post date: [August 10, 2023, 9:30am UTC](https://discourse.vtk.org/t/volume-opacity/12123/3 "2023-08-10T09:30:53Z")

</div>

Hi Julien,

Is it a kind of achievement like this example? [WebGL 2 Example: Order-independent Transparency](https://tsherif.github.io/webgl2examples/oit.html)

I’m still studying on it, my CPR will also need this, if it is finished, I can continue with the implementation.

---

<div class="post-metadata">

### Author: ![finetjul](https://discourse.vtk.org/user_avatar/discourse.vtk.org/finetjul/32/154_2.png) [@finetjul](https://discourse.vtk.org/u/finetjul)
#### Post date: [August 10, 2023, 11:57am UTC](https://discourse.vtk.org/t/volume-opacity/12123/4 "2023-08-10T11:57:05Z")

</div>

> [WebGL 2 Example: Order-independent Transparency](https://tsherif.github.io/webgl2examples/oit.html)

This won’t do it. It is not fit to support both meshes AND volumes. Only DepthPeeling will work with my understanding.

You can look at the [VTK C++/OpenGL](https://vtk.org/Wiki/VTK/Depth_Peeling) implementation.