Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Learn to draw smile with d3

Public visualization

Viewing a saved revision (read-only)

50464ae7c0b54b44b0a4bbbbf40c0db8

Learn to draw smile with d3

0 stars2🌍 Public
VVincent Ko
Last edited Feb 16, 2019
Created on Feb 15, 2019

This example demonstrates basic SVG shape drawing with D3, showing circles, rectangles, lines, and paths arranged to form a playful smiley composition. The code uses plain D3 selections to append SVG elements inside a `<g>` container with a scale transform, while CSS classes like `.lines` style the stroke properties. A video tutorial link accompanies the code, which uses D3 v3 to manipulate SVG attributes directly without data binding or advanced visualization techniques.

AI-generated description

An example including some commonly used features of SVG.