Visualize Data

This workflow guides you through creating data-driven animations in Helios.

1. Choose Your Library

• D3.js: Best for complex charts, graphs, and SVG-based visualizations.
• P5.js: Best for generative art, creative coding, and pixel manipulation (Canvas).
• Three.js: Best for 3D data visualization.
• Vanilla Canvas: Best for high-performance custom visualizations.

2. Prepare Your Data

Load your data (JSON, CSV) and ensure it is available when the composition starts.

// Load data
import rawData from './data.json';