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)

35a8ee9cb0684495ab9e5f8757657b69

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.