Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Manipulating SVG elements

Public visualization

Manipulating SVG elements

0 stars1🌍 Public
SSreenivasulu
Last edited Feb 6, 2022
Created on Aug 16, 2020
Forked from HTML Starter

This example demonstrates how to manipulate SVG elements interactively using D3.js within a React framework. A single yellow rectangle changes color, size, and stroke properties when users click buttons labeled "Change Color!", "Grow big!", and "Go back!". The code uses d3.select to target the rectangle by ID and modifies attributes such as fill, width, height, and stroke-width. The heading text also turns red through d3.style. The example uses d3.v5 and renders SVG directly in the browser, with styles defined in an external CSS file.

AI-generated description

A bare minimum HTML page.

See also React Starter.

Comments

Sign in to join the discussion.

MIT Licensed