Menu
I'm trying to create a "parrallel" bezier curve. In my attempts I've gotten close but no cigar. I'm trying to keep a solid 1px offset between the 2 curves (red,blue).
My main goal is use a edge offseting algorythm to expand/shrink a svg path.
Solution
For anyone else who is looking for a solution, I've create a AS3 version.
http://seant23.wordpress.com/2010/11/12/offset-bezier-curves/
735
Explanation: The control points are used to adjust the shape of a Bezier curve.
In general, a cubic Bezier curve is parametrically defined as(2.68)Pt=1tt2t31000−33003−630−13−31V0V1V2V3,0≤t≤1where V0, V1, V2, V3 are the control points of the Bezier curve.
A cubic Bézier curve is defined by four points P0, P1, P2, and P3. P0 and P3 are the start and the end of the curve and, in CSS these points are fixed as the coordinates are ratios (the abscissa the ratio of time, the ordinate the ratio of the output range).
From wikipedia: ( http://en.wikipedia.org/wiki/B%C3%A9zier_curve )
The curve at a fixed offset from a given Bézier curve, often called an offset curve (lying "parallel" to the original curve, like the offset between rails in a railroad track), cannot be exactly formed by a Bézier curve (except in some trivial cases). However, there are heuristic methods that usually give an adequate approximation for practical purposes.
You might also see the paper indicated here: Outline of cubic bezier curve stroke
37
I hope you found my math paper useful
Quadratic bezier offsetting with selective subdivision https://microbians.com/mathcode
101
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
