I've noticed that several PDF Annotation applications (Adobe Acrobat, Bluebeam, etc) have an algorithm for creating a cloud pattern around a polygon:
When you drag the vertices of this polygon, the cloud pattern is recalculated:
Notice how the arcs are recalculated to wrap around the polygon. They are not being stretched or warped. Whatever algorithm used to define this seems to be an industry standard. Several PDF editors allow you to create this, and in each one the cloud arcs look the same when dragging the vertices.
I am trying to create a WPF sample application that replicates this, but I can't seem to find the documentation anywhere for generating the cloud pattern.
I'm quite fluent with graphic design and 2D programming, and I'm capable of creating the tool to drag the vertices around, but I need help with figuring out how to draw these arcs. It looks like a series of
The clouds in your sketches are just a series of circles drawn along each polygon edge with a certain overlap.
An easy way to draw the filled basic cloud shape would be to first fill the polygon and then draw the circles on top of the filled polygon.
That approach falls flat when you want to fill the cloud with a partially transparent colour, because the overlap of the circles with each other and with the base polygon will be painted twice. It will also miss the small cartoon-style overshoots on the cloud curves.
A better way to draw the cloud is to create all circles first and then determine the intersecting angles of each circle with its next neighbour. You can then create a path with circle segments, which you can fill. The outline consists of independent arcs with a small offset for the end angle.
In your example, the distance between the cloud arcs is static. It is easy to make the arcs at polygon vertices coincide with by making that distance variable and by enforcing that the polygon edge is evenly divisible by that distance.
The function to draw the cloud takes an object of options such as the radius, the arc distance and the overshoot in degrees. I haven't tested degenerate cases like small polygons, but in the extreme case the algorithm should just draw a single arc for each polygon vertex.
The polygon must be defined clockwise. Otherwise, the cloud will be more like a hole in cloud cover. That would be a nice feature, if there weren't any artefacts around the corner arcs.
Edit: I've provided a simple online test page for the cloud algorithm below. The page allows you to play with the various parameters. It also shows the shortcomings of the algorithm nicely. (Tested in FF and Chrome.)
The artefacts occur when the start and end angles are not determined properly. With very obtuse angles, there may also be intersections between the arcs next to the corner. I haven't fixed that, but I also haven't given that too muczh thought.)