Using SVG path syntax in paper.js?
-
28-10-2019 - |
Question
With the raphael.js library, paths are described using the SVG path syntax, (e.g. M98.36,214.208l2.186-1.093V210.2l-3.378,0.117l1.174,4.137L98.36,214.208z
, which provides a very compact way to create a shape (especially if your shape is drawn with an external application such as Illustrator).
I'm interested in using the paper.js library (not SVG-based), but a first look at the documentation seems to show that paths are built step by step through object methods. This is a very different approach ("path building" vs "path description", one could say), not very suitable to my needs.
So: is there a way to use SVG Paths in paper.js? Or a similar "path description" solution?
Reference:
Solution
You can use SVG path syntax as described in the Paper.js reference for pathData
var pathData = 'M98.36,214.208l2.186-1.093V210.2l-3.378,0.117l1.174,4.137L98.36,214.208z';
var path = new Path(pathData);
path.strokeColor = 'black';
// Scale the copy by 1000%, so we see something
path.scale(10);
And here as an example as a Paper.js Sketch