SVGPathCommander


!image

A modern set of Typescript tools for manipulating the d (description) attribute for SVGPathElement items. The library is implementing modern JavaScript API to produce reusable path strings with lossless quality. In addition, you also have a powerful tool to convert other SVG shapes like or to .


While you may find familiar tools inside, this library brings new additions:
* the build in getBBox, getPointAtLength and getTotalLength are more reliable and much more accurate than the native methods, not to mention their high performance ratings;
* thanks to the community contributions we've implemented useful tools like getPropertiesAtLength, getSegmentOfPoint or isPointInStroke;
a tool that can reverse path draw direction* without altering path commands, even with specific shorthand path commands;
a unique tool that can reverse path draw direction* for path strings with only 'C' path commands;
a new and unique tool to apply transform functions to path commands via the modern DOMMatrix* API.

The key differences with other libraries:
* Typescript sourced with modernized codebase, all inherited codebase has been modernized as well;
* along with the modern codebase, the library also comes with strong TypeScript definitions;
* this library can create 3D to 2D projections, making your SVGs look like 3D but in the SVG coordinate system;
* you can use this library in both web apps and Node.js, you are not restricted to a single environment;
* path command transformations are all consistent with the SVG coordinates system, where others compute transform origin only for rotation transformation.

SVGPathCommander can use the DOMMatrix API for SVGPathElement path command transformation and implements a very fast and modernized DOMMatrix shim.
There are a couple of good reasons for this implementation:
WebKitCSSMatrix and SVGMatrix* APIs are slowly pushed away by DOMMatrix, the green light for new and modern implementations;
* we can actually apply a 3D transformation matrix to SVG path commands, by calculating a 2D projection of the actual shape in 3D coordinates;
* when most tools available will be rendered absolete, we are ready for new challenges.

This library is available on CDN and npm.

Install

``
npm install svg-path-commander
`

CDN

`html