How to merge volume viewer with volume contour or imageCropFilter using vtk.js?

I am trying to merge the volume viewer with volume contour and image crop filter. However, I am not getting the expected output. How to do that?

Could you please provide more information? Providing code snippets, resulting images and expected images is the best way to garner useful replies.

In that case, all you have to do is split up the render window into three different viewports. Each viewport should have its own pipeline (one for volume, one for MPR and the last one for contour). See vtk.js for an example of many viewports.

You can also use independent views (vtkRenderWindow) and rely on HTML to manage the layout…

Hi,
Actually, I am using vtkRenderWindow for independent views. I wanted to take the upload function of the volume viewer example. So that users can upload a vti file on their own. The same vti file will be shown in the four windows. The image I have shown is actually four windows, I have made all the backgrounds black.

Hmm. So, are you asking how to share the loaded 3D data between the different render windows and their pipelines?

Yes!

You should be able to do something like:

const imageData = reader.getOutputData();
mapper1.setInputData(imageData); // say mapper1 is a volume mapper (pipeline 1)
filter1.setInputData(imageData); // say filter1 is a crop filter (pipeline 2)
mapper2.setInputData(imageData); // say mapper2 is a slice mapper (pipeline 3)

In the above code, the same data is being passed to three different pipelines.