

In [26]:

    
vtk_example = '''
<div id="container">
</div>

<script type="text/javascript" src="https://unpkg.com/vtk.js"></script>
<script type="text/javascript">


// ----------------------------------------------------------------------------
// Standard rendering code setup
// ----------------------------------------------------------------------------

//var fullScreenRenderer = vtk.Rendering.Misc.vtkFullScreenRenderWindow.newInstance();
var renderWindow = vtk.Rendering.Core.vtkRenderWindow.newInstance();
var renderer = vtk.Rendering.Core.vtkRenderer.newInstance({ background: [0.2, 0.3, 0.4] });
renderWindow.addRenderer(renderer);


// ----------------------------------------------------------------------------
// Simple pipeline ConeSource --> Mapper --> Actor
// ----------------------------------------------------------------------------

var coneSource = vtk.Filters.Sources.vtkConeSource.newInstance({ height: 1.0 });

var mapper = vtk.Rendering.Core.vtkMapper.newInstance();
mapper.setInputConnection(coneSource.getOutputPort());

var actor = vtk.Rendering.Core.vtkActor.newInstance();
actor.setMapper(mapper);



// ----------------------------------------------------------------------------
// Add the actor to the renderer and set the camera based on it
// ----------------------------------------------------------------------------

renderer.addActor(actor);
renderer.resetCamera();

// ----------------------------------------------------------------------------
// Use OpenGL as the backend to view the all this
// ----------------------------------------------------------------------------

var vtkOpenGLRenderWindow = vtk.Rendering.OpenGL.vtkRenderWindow;
var openglRenderWindow = vtkOpenGLRenderWindow.newInstance();
renderWindow.addView(openglRenderWindow);

// ----------------------------------------------------------------------------
// Create a div section to put this into
// ----------------------------------------------------------------------------

//var container = document.createElement('div');
//document.querySelector('body').appendChild(container);
openglRenderWindow.setContainer(container);

// ----------------------------------------------------------------------------
// Setup an interactor to handle mouse events
// ----------------------------------------------------------------------------

var interactor = vtk.Rendering.Core.vtkRenderWindowInteractor.newInstance();
interactor.setView(openglRenderWindow);
interactor.initialize();
interactor.bindEvents(container);

// ----------------------------------------------------------------------------
// Add Coordinates
// ----------------------------------------------------------------------------
var axes = vtk.Rendering.Core.vtkAxesActor.newInstance();
var widget = vtk.Interaction.Widgets.vtkOrientationMarkerWidget.newInstance({
  interactor: interactor,
  actor: axes,
});

widget.setViewportSize(0.15);
widget.setMinPixelSize(50);
widget.setMaxPixelSize(100);
widget.setEnabled(true);

</script>
'''
HTML(vtk_example)









    Out[26]: