Skip to main content
Log in
0

07versiasri@gmail.com

@VersiaSri·5 public vizzes

Loading thumbnail…

Fork of Rendering Data with React &

This visualization displays the complete set of CSS named colors as a radial burst, with each color represented as a wedge arranged around a central point. The code uses the `d3.csv` utility to fetch color data from a remote CSV file, then leverages React's `useState` and `useEffect` hooks to manage asynchronous data loading. Rendering is handled through React's SVG output, with `d3.pie` computing arc segments and `d3.arc` generating the path geometry for each colored wedge.

Aug 12, 2024
Loading thumbnail…

Fork of Line Chart

This fork of a line chart visualizes daily surface air temperature data from 1940 onward, colored by year using the d3 interpolatePlasma color scale. The chart plots each year as a separate line, with 2024 highlighted in thick red for emphasis, while a semi-transparent inner rectangle provides background contrast. The code uses d3’s scaleLinear, extent, line, and flatGroup to prepare and render the multiple series, alongside the responsive-axes library for labeled axes and the observeResize utility for container dimensions.

Aug 12, 2024
Loading thumbnail…

Fork

This example demonstrates the VizHub V3 Runtime Environment's "Hello World" template, which serves as a minimal starting point for interactive coding. The exported `main` function receives a `container` DIV and writes a stylized text element whose `font-size` property can be adjusted in real time by Alt-dragging the numeric value in the editor. This illustrates the platform's continuous hot-reloading capability, where code changes and widget interactions produce immediate visual feedback without manual refresh.

Aug 12, 2024
Loading thumbnail…

Fork of Blank Slate with Hot Reloading

This example demonstrates the VizHub V3 runtime's core feature of continuous hot reloading, rendering a "Hello World!" message whose font size updates interactively. The code defines an exported `main` function in `index.js` that writes inline HTML into a container, with no external libraries. Users can adjust a `fontSize` variable by holding Alt and dragging the number in the editor. This blank slate highlights the simplified entry point of the runtime, using the `container` and `options` arguments without requiring an `index.html` file.

Aug 12, 2024
Loading thumbnail…

Fork of Blank Slate with Hot Reloading

This example demonstrates the VizHub V3 runtime's core feature of continuous hot reloading, rendering a "Hello World!" message whose font size updates interactively. The code defines an exported `main` function in `index.js` that writes inline HTML into a container, with no external libraries. Users can adjust a `fontSize` variable by holding Alt and dragging the number in the editor. This blank slate highlights the simplified entry point of the runtime, using the `container` and `options` arguments without requiring an `index.html` file.

Aug 12, 2024