sirusxcoder

@SirusXCoder·3 public vizzes

HW

This example demonstrates the minimal "Hello World" template for the VizHub V3 runtime environment, displaying the text at a fixed font size of 242 pixels. It shows how the exported `main` function receives a container element and uses its dimensions to render content, while the empty state object and `setState` function enable future interactive updates. The code uses plain HTML and inline styles via template literals, with no external libraries. The example highlights the hot-reloading workflow where changes to the `fontSize` variable are reflected live in the browser.

Mar 10, 2024

Loading thumbnail…

Fork of Hello VizHub

This example demonstrates the basic integration of D3.js and ES6 modules in a VizHub project, showing how to import local modules and D3 APIs to manipulate the DOM. It displays a static message, “Hello VizHub!”, centered on the page using the `select` function from D3 v5 to set the text content of a `div`. The code imports a string from a local `myMessage.js` module and uses it via `select('#message').text(message)`. Styling is applied through a linked `styles.css` file. No data is loaded or visualized; the focus is purely on module syntax and minimal DOM interaction.

Mar 10, 2024

Loading thumbnail…

Fork of Blank Slate with Hot Reloading

This example demonstrates the minimal setup for a VizHub V3 visualization, showing a static "Hello World!" message rendered inside a container DIV. It highlights the runtime’s hot reloading capability, where changes to the `fontSize` variable are reflected instantly without a full page refresh. The `main` function receives the `container` and uses its `clientWidth` and `clientHeight` for layout, while storing application state in an empty object and updating it via `setState` with immutable patterns. No external libraries are used, relying on plain JavaScript and inline HTML strings for rendering.

Mar 10, 2024