creating-circles
This example demonstrates the fundamental structure of a VizHub V3 visualization, starting from a blank canvas. It shows how the `main` function receives a DIV container and uses it as the mounting point for all visual output. The code implements a simple circular shape using basic SVG elements within the container, serving as a minimal "Hello World" for the runtime environment. The example highlights the V3 Runtime's continuous hot-reloading capability, where changes to the code instantly update the rendered visualization. It uses plain JavaScript and SVG APIs, with no external libraries, to establish the baseline for subsequent tutorials.
AI-generated descriptionA blank slate starting point showing the "Hello World" for the VizHub V3 Runtime Environment, which supports continuous hot reloading with interactive widgets.
- There is no
index.html- that's what triggers the V3 Runtime - The entry point is the
mainfunction exported fromindex.js - The
mainfunction takes an argumentcontainer, a DIV
Full course playlist: YouTube: Constructing Visualization 2024.