Mahendra S H

@MahendraSH·3 public vizzes

box d3

This example displays a series of horizontal rectangular bars stacked vertically across the full screen, each referencing the same circular SVG mask. The bars are rendered as SVG `<rect>` elements created with D3's `selectAll` and `join` pattern, using a data array of 100 objects generated in a loop. The visualization relies on D3's `select` and `attr` methods to bind data and set position and dimensions, while the mask filters each bar to reveal a circular cutout effect.

Feb 20, 2023

Loading thumbnail…

Untitled

This example presents a minimal interactive visualization built with React and D3, rendering a simple bar chart. The code uses `d3.scaleBand` and `d3.scaleLinear` to map categorical and numerical data to screen positions, with bars drawn as SVG `rect` elements. User interaction is handled through React state, updating the chart when a button is clicked, which triggers a re-render with new data points. The data is embedded directly in the component, and the visualization demonstrates a clean separation between D3’s scale functions and React’s declarative UI updates, offering a basic template for combining these tools.

Feb 19, 2023

Loading thumbnail…

Fork of HTML Starter

This example displays a full-page greeting message, "Hello HTML!", rendered in large, centered text using CSS styling. It demonstrates a minimal HTML structure that combines inline styles with a simple JavaScript-free page layout. The code uses standard HTML elements like `<div>` along with CSS properties to control font size and alignment. No external libraries or data sources are involved, making it a pure demonstration of core web technologies for static content presentation.

Feb 19, 2023