Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

D3 select() and selectAll() examples

Public visualization

Viewing a saved revision (read-only)

23545b9f0bbe45abb5c9e13d85b707b9

D3 select() and selectAll() examples

0 stars2🌍 Public
AAxVa 🐍 💪
Last edited Feb 3, 2024
Created on Jan 18, 2024
Forked from HTML Starter

This example demonstrates how D3’s `select()` and `selectAll()` methods locate and modify SVG elements, showing a simple bar chart whose rectangles change fill colors through chained attribute, style, and class updates. The code uses the D3 v7 library to select the `<rect>` elements by ID and class, then applies a chain of changes to the middle bar—such as setting its height, fill, and highlight class—while also updating the page title text. Console logs reveal the values read back from selected nodes, and the script prints the chart's bounding rectangle and SVG bounding box to inspect its layout.

AI-generated description

D3 select() and selectAll() examples

Visit also https://github.com/ax-va/Interactive-Data-Visualization-Dale-2023