Has anyone done any development to the Measurement widget/a custom widget to measure azimuth? There is a function to measure heading in Google Earth that would be nice to mimic inside of Web App Builder.

Has anyone done any development to the Measurement widget/a custom widget to measure azimuth? There is a function to measure heading in Google Earth that would be nice to mimic inside of Web App Builder.

- 1 person found this helpful
I ended up figuring this out outside of the measurement widget - for anyone looking for JS code:

function measureBearing(){

tb = new Draw(map);

tb.on("draw-end", lang.hitch(map, getBearing));

tb.activate(Draw.LINE);

}

function getBearing(evtObj){

var map = this,

geometry = evtObj.geometry;

map.graphics.clear();

start = webMercatorUtils.xyToLngLat(geometry.paths[0][0][0], geometry.paths[0][0][1]);

end = webMercatorUtils.xyToLngLat(geometry.paths[0][1][0], geometry.paths[0][1][1]);

start_long = start[0];

start_lat = start[1];

end_long = end[0];

end_lat = end[1];

x = Math.cos(end_lat) * Math.sin(end_long - start_long);

y = Math.cos(start_lat) * Math.sin(end_lat) - Math.sin(start_lat) * Math.cos(end_lat) * Math.cos(end_long - start_long);

b = Math.atan2(x,y);

degrees = b * (180/Math.PI);

console.log(degrees);

if (degrees < 0){

degrees = 180 - Math.abs(degrees) + 180;

}

document.getElementById("measurementOutput").innerHTML = "<b>Bearing: </b>" + degrees.toFixed(2) + '9\xB0';

document.getElementById("measurementOutput").style.display = "block";

var graphic = map.graphics.add(new Graphic(geometry, new SimpleLineSymbol(

SimpleLineSymbol.STYLE_DASH,

new Color([255,0,0]),

3

)));

}

Linda,

I have not and I have not seen where any other developer has this either. Looking at Tom Sellsted's Measure widget there is already some trig function in there to calculate the angle to place the text at when drawing the line so you could easily add this angle to the text symbols length text that is currently being added.