Drawing bearing and distance property line using C#/SVG/IE9.

If you read an official property legal desciption, property line are often described using bearing and distance. Here is an example:

BEGINGING AT THE NORTHWEST CORNER OF SAID SOUTHWEST QUARTER OF THE SOUTHWEST QUARTER OF SECTION 9; THENCE SOUTH 89°35'11" EAST; 246.35 FEET ALONG THE NORTH LINE THEREOF; THENCE SOUTH 19°38'26" EAST, 36.08 FEET; ...

For each segment, the bearing part (e.g. SOUTH 89°35'11" EAST) specifies the direction of the line, which is followed by the length of the line. The relative degree of the line is specific using sexagesimal system (base-60, degree/minute/second). So 89°35'11" is really 89 + 35 / 60 + 11 / 3600 degrees. SOUTH 89°35'11" EAST means starting from south direction, turning 89.586 degrees to east.

Sometimes you can find a nicely drawn diagram (e.g. plat diagram, often as an TIFF image), but sometimes you just have the textual description and nothing else. The later is often the case in easement documents. Now the problem is how to convert such description into something we can visualize easily;

Here is a simple C# program which converts bearing and distance property description into SVG format, viewable using IE 9 (file attachment Program.cs).

Sample Input file:

S 893511 E 246.35
S 193826 E 36.08
S 614605 E 113.79
S 492357 W 87.36
N 843400 W 58
N 052600 E 112.75
N 193826 w 18.03
n 893511 w 239.2

SVG output generated by the program:

 <?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"  "https://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="640" height="480" viewBox="0 0 358.724254050077 146.439267225064" xmlns="https://www.w3.org/2000/svg" version="1.1">
<line x1="0" y1="0" x2="400" y2="0" style="stroke:black;stroke-width:0.5;stroke-dasharray:1,1"/>
<line x1="0" y1="100" x2="400" y2="100" style="stroke:black;stroke-width:0.5;stroke-dasharray:1,1"/>
<line x1="0" y1="200" x2="400" y2="200" style="stroke:black;stroke-width:0.5;stroke-dasharray:1,1"/>
<line x1="0" y1="0" x2="0" y2="200" style="stroke:black;stroke-width:0.5;stroke-dasharray:1,1"/>
<line x1="100" y1="0" x2="100" y2="200" style="stroke:black;stroke-width:0.5;stroke-dasharray:1,1"/>
<line x1="200" y1="0" x2="200" y2="200" style="stroke:black;stroke-width:0.5;stroke-dasharray:1,1"/>
<line x1="300" y1="0" x2="300" y2="200" style="stroke:black;stroke-width:0.5;stroke-dasharray:1,1"/>
<line x1="400" y1="0" x2="400" y2="200" style="stroke:black;stroke-width:0.5;stroke-dasharray:1,1"/>
<path d="M 0 0
  l 246.343581111762 1.77835458583686
  l 12.1271482740708 33.9808574750359
  l 100.253524664245 53.8274548199679
  l -66.3291145282373 56.8526003442234
  l -57.7394086754221 -5.49187452629729
  l 10.6760147041382 -112.243419450928
  l -6.0602129540326 -16.9810105397699
  l -239.193767411948 -1.72674007279144
z" fill="yellow" fill-opacity="0.5" stroke="black" stroke-width="1" />
</svg>

SVG output rendered by IE9

Surprise: The SVG file generated can be imported directly by Microsoft Visio. You can even ungroup it, and then change line and fill properties.

Program.cs