How to remove vtkVolumeController without affecting the volume rendering

Web
1

Hey, The code below is working good, it is rendering a VTI volume from the server, but when I remove the vtkVolumeController, the volume is not rendered I see only a black screen, I want to remove the controllerWidget without hiding the volume.

function createViewer(rootContainer) {

           

            const renderWindow = vtkRenderWindow.newInstance();

            const renderer = vtkRenderer.newInstance();

            renderWindow.addRenderer(renderer);

            const vtiReader = vtkXMLImageDataReader.newInstance();

            vtiReader.setUrl("http://localhost:3000/volume.vti").then(()=>{

            const source = vtiReader.getOutputData(0);

            const mapper = vtkVolumeMapper.newInstance();

            const actor = vtkVolume.newInstance();

            actor.setMapper(mapper);

            mapper.setInputData(source);

            renderer.addActor(actor);

            // Configuration

            const property = actor.getProperty();

            const cfun = vtkColorTransferFunction.newInstance();

            const ofun = vtkPiecewiseFunction.newInstance();

            property.setRGBTransferFunction(0, cfun);

            property.setScalarOpacity(0, ofun);

            property.setUseGradientOpacity(0, true);

            property.setInterpolationTypeToFastLinear();

            property.setScalarOpacityUnitDistance(0, 3);

            property.setInterpolationTypeToLinear();

            property.setGradientOpacityMinimumValue(0, 2);

            property.setGradientOpacityMaximumValue(0, 20);

            property.setGradientOpacityMinimumOpacity(0, 0);

            property.setGradientOpacityMaximumOpacity(0, 1);

            mapper.setSampleDistance(1);

            const camera = renderer.getActiveCamera();

            const pos = camera.getFocalPoint();

            pos[2] += 15;

            camera.setPosition(...pos);

            camera.setViewUp(0, -1, 0);

            //Rendering + interaction

            const openglRenderWindow = vtkOpenGLRenderWindow.newInstance();

            renderWindow.addView(openglRenderWindow);

            openglRenderWindow.setContainer(rootContainer);

            const interactor = vtkRenderWindowInteractor.newInstance();

            interactor.setView(openglRenderWindow);

            interactor.initialize();

            interactor.bindEvents(rootContainer);

            interactor.setInteractorStyle(vtkInteractorStyleTrackballCamera.newInstance());

            renderWindow.getInteractor().setDesiredUpdateRate(30);

            renderer.resetCamera();

            const controllerWidget = vtkVolumeController.newInstance({

                size: [300, 100],

              });//I want to remove THIS

            const container = document.getElementById("controller")

            controllerWidget.setContainer(container);

            controllerWidget.setupContent(renderWindow, actor, true);
            })
          }

Also unllike the example from the VTK site, I see a little decrease of the volume quality I don’t know why

2

You need to call renderWindow.render() after resetting the camera. vtkVolumeController presumably does it for you, but removing it means you need to be explicit about when your renders happen.

3

Thank you Forrest, Yes I tried renderWindow.render() but it does not show anything, I tried to add this and it worked, no idea how :

const cfun = vtkColorTransferFunction.newInstance();
const ofun = vtkPiecewiseFunction.newInstance();
ofun.addPoint(-3024, 0.1);
ofun.addPoint(-637.62, 0.1);
ofun.addPoint(700, 0.5);
ofun.addPoint(3071, 0.9);
cfun.addRGBPoint(0, 0, 0, 0);
cfun.addRGBPoint(255, 1.0, 1.0, 1.0);
4

Oh, right, good catch. Volumes do need a color transfer function as well, in order to map voxel values to colors (and opacities). I assumed there was a grayscale mapping by default.