block by gabrielflorit f29da1c65d47dd2acb58061adbef53a2

Line interpolation with SVG

Full Screen

This is an experiment to see what’s the most performant way of animating hundreds of lines over time.

This one uses svg to draw the lines. Every tick, each path‘s stroke-dasharray attribute is updated by a given pct.

Use the slider to manually adjust the line lengths.

Also see Line interpolation with Canvas

Made with blockup

script.js

index.html

Makefile

dist.css

dist.js

getFeatures.js

package.json

style.styl

yarn.lock