Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

HTML Starter

Public visualization

HTML Starter

0 stars0🌍 Public
AAndrew Yan
Last edited Jun 6, 2020
Created on Jun 6, 2020
Forked from HTML Starter

This example showcases a line drawing of an intricate shape that animates itself onto the screen using a stroke-dash technique. The path is drawn over three seconds with a linear ease. The code uses D3.js version 3.5.6 to select the body, append an SVG, and create the path. It then leverages `path.node().getTotalLength()` and transitions with `attrTween` to animate the `stroke-dasharray` and `stroke-dashoffset` attributes, creating the effect of the line being traced. The underlying data is a static, pre-defined SVG path.

AI-generated description

A bare minimum HTML page.

See also React Starter.

Comments

Sign in to join the discussion.

MIT Licensed