Attempting develop navigation compass

I am working on a concept project where I want to be able to drag out lines over an image of a location (let’s say it is an outdoor park)( this image will act as my map) and be able to get compass heading information from each point. To explain further, you will have numerous places to start your course. You click and drag out a line to the first destination, compass information reports at the cursor. You release at the first destination course information reports in a panel outside the map. You can repeat the process to build up successive legs of your course that all reports to the panel outside the map. Other things are planned but this is the initial step.

Is there an API or Component out there that I could tailor to work on a map of the scale I spoke of? Any thoughts about where to start.?