Databases
StackOverflow2013
Postsdbo
POpaper.js union difference and intersection
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POpaper.js union difference and intersection
    text
    copied!<p>I'm working on a project in paper.js where I need to create new paths based on the intersection, difference and union of two others. I did some digging and found the mathematical function that interpolates a cubic bezier spline, but I was wondering if there were any javascript libraries that did svg-like vector arithmetic. If anything, I'll copy inkscape's and convert it to javascript, but you never know. Anyway, the mathematical function for interpolating cubic beziers is as follows:</p> <pre><code>Pointx = (Ax * percent^3) + (Bx * 3 * (percent^2 * (1-percent))) + (Cx * 3 * (percent * (1-percent)^2)) + (Dx * (1-percent)^3) Pointy = (Ay * percent^3) + (By * 3 * (percent^2 * (1-percent))) + (Cy * 3 * (percent * (1-percent)^2)) + (Dy * (1-percent)^3) </code></pre> <p>Where A, B, C and D are the points for the curve. A is the start, D is the end, and B and C are the "control points" that manipulate the curvature between A and D. The <code>percent</code> is how far along the curve to calculate on a scale from 0 to 1.</p> <p>So it would be pretty trivial coming up with an interpolation function that returns a point for a provided bezier and a percentage along the bezier. Finding the inverse - a percentage(s) for a given point (or x value or y value) would be difficult. Or even more difficult, where two beziers intersect (I'm not very good at math). I'm hoping that's what inkscape's functions provide.</p> <p>Are there any javascript libraries that can do this kind of vector interpolation quickly? If not, I'll post the algorithm I come up with here. Thank you!</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload