vtk.js-examples/standalone.html at master · KitwareMedical/vtk.js-examples · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<!DOCTYPE html>
<html>
	<head>
		<script type="text/javascript" src="https://unpkg.com/vtk.js"></script>
	</head>
	<body>
		<div id="container"></div>
		<script type="text/javascript">

			const container = document.querySelector('#container');

			// VTK renderWindow/renderer
			const renderWindow = vtk.Rendering.Core.vtkRenderWindow.newInstance();
			const renderer     = vtk.Rendering.Core.vtkRenderer.newInstance();
			renderWindow.addRenderer(renderer);

			// WebGL/OpenGL impl
			const openGLRenderWindow = vtk.Rendering.OpenGL.vtkRenderWindow.newInstance();
			openGLRenderWindow.setContainer(container);
			openGLRenderWindow.setSize(1000, 1000);
			renderWindow.addView(openGLRenderWindow);

			// Interactor
			const interactor = vtk.Rendering.Core.vtkRenderWindowInteractor.newInstance();
			interactor.setView(openGLRenderWindow);
			interactor.initialize();
			interactor.bindEvents(container);

			// Interactor style
			const trackball = vtk.Interaction.Style.vtkInteractorStyleTrackballCamera.newInstance();
			interactor.setInteractorStyle(trackball);

			// Pipeline
			const cone   = vtk.Filters.Sources.vtkConeSource.newInstance();
			const actor  = vtk.Rendering.Core.vtkActor.newInstance();
			const mapper = vtk.Rendering.Core.vtkMapper.newInstance();

			actor.setMapper(mapper);
			mapper.setInputConnection(cone.getOutputPort());
			renderer.addActor(actor);

			// Render
			renderer.resetCamera();
			renderWindow.render();

		</script>
	</body>
</html>