Driving Direction
API user can draw driving direction on map. Set origin and destination then click Direction button.
Directions are requested using the AGDirections.load() and AGDirections.loadFromWayPoints() methods. If direction object
is construct with agmap then those function draw a direction on the map. if a panel is passed in AGDirection constructor
then it will fill the panel with direction instructions.
Driving Direction
function btnCustomRoute_onclick()
{
var arrWayPoits = getWayPoints();
oDirection = new AGDirections();
oDirection.loadFromWayPoints(arrWayPoits);
AGEvent.addListener(oDirection, "onload", directionloadhandler);
}
//get waypoints from textboxes
function getWayPoints()
{
var arrWayPoints = new Array();
var arr = document.getElementById("txtOrigin").value.split(',');
arrWayPoints.push(new AGCoord(parseFloat(arr[0]),parseFloat(arr[1])));
arr = document.getElementById("txtDestination").value.split(',');
arrWayPoints.push(new AGCoord(parseFloat(arr[0]),parseFloat(arr[1])));
return arrWayPoints;
}
//draw driving route line
function directionloadhandler()
{
var arrCoords = oDirection.getVertices();
var oVectorStyleOpts = AG_DEFAULT_VECTOR_OPTIONS.copy();
oVectorStyleOpts.strokeColour = "red";
oVectorStyleOpts.strokeWidth = 5;
oVectorStyleOpts.strokeOpacity = .3;
var oLine = new AGPolyline(arrCoords,oVectorStyleOpts);
agmap.addOverlay(oLine);
oDirectionCustom.push(oLine);
}
Driving Direction as text
To get the driving directions in a div panel, you need to specify the div when you instantiate
the AGDrivingDirections class
Driving Direction Text
var arrWayPoits = getWayPoints();
oDirection = new AGDirections(agmap, document.getElementById("DrivingDirectionsPnl"));
oDirection.loadFromWayPoints(arrWayPoits);