Luis Galindo

@lluigil·2 public vizzes

SVG Fundamentals

This example demonstrates the "Hello World" of the VizHub V3 Runtime Environment, showing how a simple SVG text element can be rendered and dynamically resized. The code exports a `main` function that takes a container DIV and sets its inner HTML with a styled text element. By holding Alt and dragging the numeric value for `fontSize` in the editor, the text size updates in real-time through the environment's continuous hot reloading feature. The example highlights the streamlined entry point and interactive widgets that enable immediate visual feedback without requiring an index.html file.

Jul 19, 2024

Loading thumbnail…

SVG Fundamentals

This example demonstrates the fundamental SVG shape elements, including circles, rectangles, ellipses, lines, polylines, polygons, and paths, rendered with various fills, strokes, and opacity settings. It visually catalogs each shape type in a static, non-interactive layout, with the SVG markup generated directly via D3 v3’s selection and attribute methods. The code relies on D3’s `append` and `attr` APIs to construct the SVG structure, showing how basic geometric primitives compose a clear reference chart without data binding or animation.

Jul 19, 2024