RenderWindow example? about vtk-js

[martinken]

Here is an example from before Seb converted them. I think it should work.

https://github.com/Kitware/vtk-js/blob/27abf6817e8edc621f00fbd441b551bde6d3e060/Examples/WebGL/Cone/index.js

But yes +1 we need to have at least one example that does not use the full screen helper.

[jourdain]

Well you can also look at the content of the code of the FullScreenRenderWindow.

But I guess you are right, we should have a plain fully descriptive RenderWindow/Renderer/Interactor example. It's just always the same boilerplate, which pushed me to create that full screen guy so we won't have to much clutter in the examples code. ;-)

[laurennlam]

@zachmullen Here is an example I often use for my projects :

<div id="3DVisualization" style="height: 800px; width: 800px;"></div>

import vtkOpenGLRenderWindow     from 'vtk.js/Sources/Rendering/OpenGL/RenderWindow';
import vtkRenderer               from 'vtk.js/Sources/Rendering/Core/Renderer';
import vtkRenderWindow           from 'vtk.js/Sources/Rendering/Core/RenderWindow';
import vtkRenderWindowInteractor from 'vtk.js/Sources/Rendering/Core/RenderWindowInteractor';

initializeViewer(divName) {
  this.renderWindow = vtkRenderWindow.newInstance();
  this.renderer = vtkRenderer.newInstance();
  this.renderWindow.addRenderer(this.renderer);
  this.openglRenderWindow = vtkOpenGLRenderWindow.newInstance();
  const container = document.getElementById(divName);
  this.openglRenderWindow.setContainer(container);
  this.renderWindow.addView(this.openglRenderWindow);

  const dimsContainer = container.getBoundingClientRect();
  this.openglRenderWindow.setSize(dimsContainer.width, dimsContainer.height);

  this.interactor = vtkRenderWindowInteractor.newInstance();
  this.interactor.setView(this.openglRenderWindow);
  this.interactor.initialize();
  this.interactor.bindEvents(container);
}

Here, divName = 3DVisualization.

Hope it helps.

[martinken]

We now have a minimal example in Examples\WebGL\SimpleCone