Dotted/Dashed Bezier Curves

Thanks Bradley and Dave. I’ve checked out the code and the algorithm is essentially the same as I posted above except it doesn’t take into account segment distance so the dashes get stretched with the curve. Also there’s something wrong with the dash on/off toggling logic causing spurious bits to show up, both demonstrated in this pic…

The time and quality can be greatly improved by drawing fewer lines (segment interpolation) and an optimized sampling method (Get_Point instantiates a Pair and accesses 6 computed properties each time). With those changes custom drawing is 1.5-3 times faster than CurveShape for a line thickness of 1. For a thickness of 2 the times are about the same, though I get these weird wrinkles with CurveShape…

CurveShape, line thickness 2

Bezo, line thickness 2

For a thickness of 10 custom drawing is about 2x slower. Another difference is CurveShape has square/flat endcaps while custom drawing with DrawLine has round endcaps.

Here’s the improved algorithm wrapped in class Bezo, a work in progress, optimizations to be made. Uses interpolation for dash patterns and can handle any number of control points. In the demo you can drag the control points around, context-click on a control point to remove it or context-click on an empty space to append a control point there.

There’s many more features I want to add, mostly adaptive/sub-sampling resolution based on curvature.

Something that can’t be implemented directly is allowing for alpha. Where DrawLines overlap the color darkens and using DrawPolygon for a dash always closes the path (plus the end caps are flat and the miter isn’t limited). You’d have to draw into a pictures alpha channel then DrawPicture that to the destination.

I found an old experiment project that uses NSBezierPath which allows for controlling end-cap, line-join, miter, dash, alpha and sub-pixel coordinates. Haven’t timed it, and it’d be mac only but those extra options are tempting :slight_smile:

Still on the wishlist I suppose? I’d love this for the web canvas too please…

I put a feature request in for this a few days ago:


I’ve updated <> and it would be nice, if some of you could gave some Points to this. Thank you very much.