Vtk test

100%

✓ Published0🌍 Public

Last edited Apr 28, 2025

Created on Feb 21, 2025

This example displays a red 3D cone rendered in a full-screen interactive viewport using VTK.js. The visualization pipeline connects a vtkConeSource to a vtkMapper and vtkActor, then adds the actor to the renderer before resetting the camera. Mouse and touch controls enable rotation and zooming of the cone, demonstrating basic scene setup and interaction with Kitware's VTK.js library.

AI-generated description

A basic VTK.js example showing a 3D cone that can be interacted with using mouse/touch controls.

Original example: https://github.com/Kitware/vtk-js/blob/master/dist/index.html

This example demonstrates:

Setting up a full screen render window
Creating a basic 3D shape (cone)
Setting up the visualization pipeline
Basic camera positioning
Mouse/touch interaction

Built using VTK.js from Kitware.

MIT Licensed

Similar vizzes

Loading thumbnail…

Untitled

This interactive visualization provides a volume rendering of a user-uploaded .vti file, with a transfer function editor for exploring the data. It displays a 3D rendered volume using VTK.js alongside a D3.js-based interface showing a color bar and an adjustable opacity curve. Users can switch among sequential, diverging, and categorical color transfer functions via buttons, and can drag control points on the opacity curve to adjust the mapping. The rendering is updated live with `updateVR` as the transfer functions change.

HHASAN0176

65% match

Loading thumbnail…

pro_2

A single pink torus rotates slowly in a dark blue 3D scene, with interactive camera controls that let viewers orbit around the object. The visualization uses Three.js with WebGL rendering, creating a MeshPhongMaterial that responds to ambient and directional lighting for realistic shading. An animation loop updates the torus rotation and calls OrbitControls for smooth damping, while a window resize listener keeps the perspective camera aligned with the viewport. The scene demonstrates basic Three.js geometry, lighting, and animation in a minimal setup.

Aarchanaadharani1@gmail.com

59% match

Loading thumbnail…

three-vrm example

A 3D VRM avatar performs motion capture animation synced to a live webcam feed. The webcam video and PoseNet-detected keypoints are drawn onto a 2D overlay canvas, while the estimated pose data drives the avatar’s joint rotations in a Three.js WebGL scene with GridHelper and AxesHelper. The code uses TensorFlow.js PoseNet, THREE.VRM, GLTFLoader, and OrbitControls, rendering the avatar from a local .vrm model.

HHirosaji

58% match

Loading thumbnail…

VCT 2023

This interactive dashboard explores statistics from VCT 2023, offering dropdown menus to switch between viewing data aggregated by agent, map, or player. It displays scatterplots of selected attributes like KD ratio, pick rate, and headshot percentage, alongside bar charts and a pie chart for win rate. Built with D3 v4, the visualization uses dynamic SVG rendering, transitions, and tooltips to show detailed values upon hover. The code demonstrates importing D3 modules for scales, axes, and dropdown menus, plus custom ES6 modules for scatterplots and menu handling.

Ddaniel

58% match

Loading thumbnail…

Testing

This example demonstrates the basic capabilities of the VizHub V3 runtime environment, starting with an SVG scene that renders a circle, a line, and a polyline path using static coordinates. The main `index.js` file exports a `main` function that takes a container element and injects HTML with a "Hello World" message, using inline styles for font sizing. The code highlights the simplified entry point without an `index.html`, and the SVG markup is presented directly within a separate HTML file. No external libraries are used, showcasing pure SVG elements and DOM manipulation.

OOska Cheng

58% match

Loading thumbnail…

D3

This example demonstrates the VizHub V3 runtime environment, featuring an interactive SVG visualization. It displays a red circle that moves in response to mouse movement, with its position updated based on the cursor’s coordinates. The code uses React’s `useState` and event handlers, a constant `circleRadius`, and the container dimensions to render the circle’s movement. The SVG’s `onMouseMove` property triggers a state update, showcasing real-time interaction within the React framework.

AAbu Faisal

57% match

Loading thumbnail…

Hello VizHub

An interactive 3D scatter plot and grid is rendered with D3.js, using randomly generated data points and a coordinate grid. The visualization displays a 3D space where points are colored using `d3.scaleOrdinal` and the `d3.schemeCategory20`, with a y-axis scale and labels. Users can click and drag to rotate the 3D scene, with the rotation logic driven by `d3.drag()` events and `_3d()` API calls for grid, point, and line strip shapes. This example demonstrates the use of D3’s 3D extension and custom event handling for dynamic, animated rendering.

FFlorro

57% match

Loading thumbnail…

Fork of 3D Brain Structure Interactive

This interactive 3D brain model visualizes the human brain’s major anatomical structures, each color-coded and clickable to reveal its function in an info panel. Built with Three.js and OrbitControls, the scene uses CSS2DRenderer for labels and includes toggleable neuron views and a detailed neuron display. The static, stylized anatomical layout is defined in code rather than derived from external data, with WebGL rendering and smooth camera controls for exploration.

Cclaireconeclark@icloud.com

56% match