block by rveciana 209fa7efeb01f05fa4a544a76ac8ed91

Canvas path animation using svg-path-properties

Full Screen

Creating visualizations like this one but using canvas is possible.

Since the Canvas element hasn’t got the getTotalLength() method as it exists in SVG, I’m using the svg-path-properties, that allows this calculations with a good precision (<0.1px), as well as allowing the getPointAtLength function too.

index.html

path-properties.min.js

transsiberian.dbf

transsiberian.json

transsiberian.prj

transsiberian.qpj

transsiberian.shp

transsiberian.shx