How to draw the contour of a hexagon area, like in Civ 5

Question

I am trying to achieve the hexagon contour look you find in Civilization V:

I want to outline the area a unit can move to on a hexagon grid, so far I can get a list of all the tiles a unit can move to and from that select the tiles that are on the boundary, which looks like this:

Assume the list of boundary tiles are in random order. I can also get a list of all the corners on each hex. As you can see above the island in the middle would create a hole in the contour shape, Civ 5 also seems to handle these holes nicely:

Answer 1

The logic is simple: your contour is the set of all the edges that separate border tiles from non-border tiles. You can code the following:

for each boundary tile
    for each edge
        if edge is shared with a hex tile that is NOT in the boundary tile list
            mark as contour edge
render all contour edges

Note that if you want the contour to encompass the whole green area, rather than just the boundary tiles, then the condition becomes "if edge is shared with a hex tile that is NOT in the green tile list", and the outer for loop becomes "for each tile in the green list"

Answer 2

Do you have edge connectivity? If so pick an edge you know to be on the boundary and add to your list. Working in a consistent winding order (clockwise or counter clockwise) pick a vertex of that esge. Look at all neighbouring edges that share that vertex. If an edge is on the boundary travel down it and add to your list. Rinse and repeat. Eventually you will return to the original edge. Now the contour is complete.

For this to work you need dat on vertices and which edges of which tiles share them. As you traverse some edges will be on the same tile and some will take you to neigjbourinf tiles. In the end you have a polyline in the order of the boundary which would let you smooth it like civ does.