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)

ccda0d43dc6e444a865b1cc00eb95ab5

Let's make a face with D3.js

0 stars1🌍 Public
PPiotrekW2
Last edited Feb 19, 2019
Created on Feb 19, 2019

This example uses D3.js v3 to construct a cartoon face entirely from SVG elements, with each facial feature—eyes, nose, and mouth—positioned and styled through D3 selections. The face is built procedurally, combining geometric shapes and paths, while the code applies D3’s data-binding and attribute manipulation to control placement and dimensions. The rendering leverages SVG within a large viewport, and the styling is handled via external CSS. The demonstration focuses on compositional techniques rather than data mapping, showcasing D3’s utility for generative drawing and static visualization design.

AI-generated description