math - How to draw an outline around any line

Question

So I have a arbitary line (See an example shown in fig 1) made up of n points

I want to draw an outline around this line (see fig 2) so I need to calculate the points of the surrounding polygon.

I started by performing a dilation on the line but this wont work - see figure 3

Any suggestions on how to do this?

I suspect calculating the normal of each line segment for use in translating the new line below and a new line above its current position and then extending each new line to infinity and defining the points as the intersections?

Answer 1

First duplicate each line twice, once on each side at a distance of half the width you want from each original line. That gives you the green lines in the image. Then you need to visit them in order (numbered) and deal with the loose ends.

When the lines don't meet (2-3, 6-7 and 12-13) you add a line join (in blue). A line join can be a bevel join (2-3) by just connecting the points, or a miter join by extending the lines until they meet (6-7) or a round join by making a curve.

When the lines do meet, just take the intersection point (blue dots).

At the line ends, you need to add an end cap (also in blue). An end cap can be a butt cap (8-9) by connecting the points, a projecting cap (1-16) by extending the lines a little before connecting them, or a round cap (not shown).

The end result is a polygon (or path if it includes round joins) that you can then stroke or fill.