steveruizok / perfect-freehand

Draw perfect pressure-sensitive freehand lines.

Home Page:https://perfectfreehand.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Get points for the "center" line?

jacopocolo opened this issue · comments

Hi! I'm trying to use this library with three.js and was wondering: is there a way to get points for the "center" (I'm assuming) the library uses to generate the ouline of the stroke? I'm of course not talking about the points provided as an input but the points of the line after smoothing and streamlining are applied.

IMG_AE20CCFBCB5E-1

While it's possible in three.js to generate a 3D mesh in the same way you generate a SVG shape, it would be convenient for a lot of cases and approaches to also have the points of the "centeral" line, without width and miters.

Thanks!

I think I figured it out on my own: the points are available via getStrokePoints.

The one thing I did not understand from documentation is that the function needs to be imported as import { getStrokePoints } from "perfect-freehand"; and not as import getStrokePoints from "perfect-freehand";

I'll leave this open in case Steve wants to call this out specifically in documentation. I believe it would help people like me. Otherwise: feel free to close it.

Hey, glad you found the answer. I’ve updated the documentation to also show the imports for those functions.

I’d love to know more about your progress with the 3D mesh. One issue you may have is with how this algo simplifies points: if a new point on the left or right side would be too close to the previous point on that side, we skip the new point. For curved strokes, this often means that more points are added to the “outside” of the curve than to the “inside” of the curve. For a mesh, such a curve would require multiple triangles to share vertices on the inside edge. Anyway, let me know how it goes!