Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Let's make a face with D3.js!

Public visualization

Viewing a saved revision (read-only)

544ad08cd51245a983f8b01a3574c028

Let's make a face with D3.js!

0 stars0🌍 Public
VVineel Gannu
Last edited Jul 16, 2020
Created on Jul 15, 2020

A face is drawn using the country shape of Canada, loaded as TopoJSON and projected with `d3.geoMercator`. The code filters the country features by ID and renders the path with `d3.geoPath`, applying a transform to position and scale it. Clicking or hovering logs the geometry coordinates. The example demonstrates fundamental SVG DOM manipulation with D3.js v5 by appending paths and styling them directly.

AI-generated description

Demonstrates fundamental DOM manipulation using D3.js by making a smiley face whose eyebrows move.