Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Claude 3.7 Test

Public visualization

Post on XLinkedIn

Viewing a saved revision (read-only)

ae5c5a43907849b786b6c9b88d68719f

Open

Claude 3.7 Test

0 stars0🌍 Public
CCurran Kelleher
Last edited Feb 25, 2025
Created on Feb 24, 2025
Forked from D3 Starter

This stacked bar chart displays four groups with five categorical segments each, using a harmonious color palette with white strokes between segments. The visualization includes grid lines behind the bars, axes with labels, a legend, and a title. Built with D3.js v7, the code uses d3.stack(), d3.scaleBand(), and d3.scaleLinear() to generate the chart, with data hardcoded in the script and rendered as SVG that fills the browser window.

AI-generated description

D3 SVG Example

This is a simple example that demonstrates how to create an SVG graphic with various shapes using D3.js. The graphic includes:

  • Circles
  • Rectangles
  • A polygon
  • An ellipse
  • Text

The SVG is set to fill the entire page, and each shape has a different color with a black stroke.

Running the Example

  1. Install dependencies: npm install
  2. Build the project: npm run build
  3. Open index.html in your browser