nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Route Task Assistance

dcoley

Hello-
If anyone can provide assistance with the following code, that would be great. The code works, a route is defined using our internal NA, but does not draw a graphic route upon returning results. I feel certain I have mis-called the route results, and/or am not passing in graphics correctly. Here is the code. It is culled from the existing sample, I have attempted to update syntax to 1.9

var mapMain, routeTask, routeParams, stopSymbol, routeSymbol, lastStop;

// @formatter:off
require([
"esri/map",
"esri/geometry/Extent",
"esri/graphic",
"esri/symbols/SimpleMarkerSymbol",
"esri/symbols/SimpleLineSymbol",
"esri/tasks/FeatureSet",
"esri/tasks/RouteTask",
"esri/tasks/RouteParameters",
"esri/tasks/RouteResult",
"esri/units",

"dojo/parser",
"dojo/ready",
"dojo/_base/Color",

"dijit/layout/BorderContainer",
"dijit/layout/ContentPane"],
function(
    Map, Extent, Graphic, SimpleMarkerSymbol, SimpleLineSymbol, FeatureSet, RouteTask, RouteParameters, RouteResult, Units,
    parser, ready, delcare, Color, BorderContainer, ContentPane
) {
ready(function() {

mapMain = new Map("cpCenter", {
   basemap : "streets",
   extent : extentInitial,
   lods : myLods,
   showAttribution: false,
});

mapMain.on("click", addStop);

routeTask = new RouteTask("https://ags2.scgov.net/arcgis/rest/services/ScOperational/RoutingService/NAServer/Route");

routeParams = new RouteParameters();
        routeParams.attributeParameterValues = [{attributeName: "Oneway", parameterName: "Restriction Usage", value: "Prohibited"},
{attributeName: "RestrictedTurns", parameterName: "Restriction Usage", value: "Prohibited"}];
        routeParams.outSpatialReference = mapMain.SpatialReference;
        routeParams.returnRoutes = true;
        routeParams.returnStops = true;
        routeParams.returnDirections = true;
        routeParams.directionsLengthUnits = Units.MILES;
        routeParams.impedanceAttribute="Length";
        routeParams.stops = new FeatureSet();

        routeTask.on("solve-complete", showRoute);
        routeTask.on("error", errorHandler);

function addStop(evt) {
stopSymbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CROSS, 20,
            new SimpleLineSymbol(
                SimpleLineSymbol.STYLE_SOLID,
                new Color([89, 95, 35]), 2
                ),
                new Color([130, 159, 83, 0.40])
                );

   var stop = new Graphic(evt.mapPoint, stopSymbol);
              mapMain.graphics.add(stop);
                routeParams.stops.features.push(stop);

   if (routeParams.stops.features.length >= 2) {
                   routeTask.solve(routeParams);
                   lastStop = routeParams.stops.features.splice(0, 1)[0]; //what does?
            }
   console.log(lastStop);
}
function showRoute(solveResult) {
   routeSymbol = new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASH, new Color([254, 0, 0]), 3);
   mapMain.graphics.add(solveResult.routeResults[0].route.setSymbol(routeSymbol));
       }

function errorHandler(err) {
        alert("An error occured\n" + err.message + "\n" + err.details.join("\n"));

        routeParams.stops.features.splice(0, 0, lastStop);
        mapMain.graphics.remove(routeParams.stops.features.splice(1, 1)[0]);

       }
   });

});

Thanks
David

Find more posts tagged with

Accepted answers

dcoley

Hi all-
Turns out I had a bit of a 500 and a 400 error. In the code below, we are calling in a local network analysis layer that has a different wkid than WebMercator, 2882 vs 3857. So, because I was not explicity setting the outSpatialReference to a new outSpatialReference, the route graphic could not draw. I also had a oversite with my onSolveComplete event callback. Here is the functioning code:

routeTask = new RouteTask("https://ags2.scgov.net/arcgis/rest/services/ScOperational/RoutingService/NAServer/Route");
//routeTask = new RouteTask("http://tasks.arcgisonline.com/ArcGIS/rest/services/NetworkAnalysis/ESRI_Route_NA/NAServer/Route");

routeParams = new RouteParameters();
        routeParams.attributeParameterValues = [{attributeName: "Oneway", parameterName: "Restriction Usage", value: "Prohibited"},
                  {attributeName: "RestrictedTurns", parameterName: "Restriction Usage", value: "Prohibited"}];

        //routeParams.outSpatialReference = mapMain.SpatialReference;
        routeParams.outSpatialReference = new SpatialReference({"wkid": 3857}); //2882
        routeParams.returnRoutes = true;
        routeParams.returnStops = true;
        routeParams.returnDirections = true;
        routeParams.directionsLengthUnits = Units.MILES;
        routeParams.impedanceAttribute="Length";
        routeParams.stops = new FeatureSet();

        connect.connect(routeTask, "onSolveComplete", showRoute); //routeTask.on
        connect.connect(routeTask, "onError", errorHandler);

function addStop(evt) {
stopSymbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CROSS, 15,
            new SimpleLineSymbol(
                SimpleLineSymbol.STYLE_SOLID,
                new Color([89, 95, 35]), 2
                ),
                new Color([130, 159, 83, 0.40])
                );

   var stop = new Graphic(evt.mapPoint, stopSymbol);
      mapMain.graphics.add(stop);
        routeParams.stops.features.push(stop);

   if (routeParams.stops.features.length >= 2) {
                   routeTask.solve(routeParams);
                   lastStop = routeParams.stops.features.splice(0, 1)[0]; //what does?
            }
   console.log(routeParams.stops.features.length);
}
function showRoute(solveResult) {
   routeSymbol = new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASH, new Color([0, 0, 254]), 3);
   mapMain.graphics.add(solveResult.routeResults[0].route.setSymbol(routeSymbol));
   console.log(solveResult.routeResults[0].route);
}

function errorHandler(err) {
        alert("An error occured\n" + err.message + "\n" + err.details.join("\n"));
        routeParams.stops.features.splice(0, 0, lastStop); //what does?
        mapMain.graphics.remove(routeParams.stops.features.splice(1, 1)[0]);
    }

Thanks All

All comments

dcoley

JohnBradley

Try this ... set the symbol before adding to the map.

function evtRouteComplete(route) {
    var routeSymbol = new esri.symbol.SimpleLineSymbol().setColor(new dojo.Color([101, 0, 255, 0.75])).setWidth(5);
    var myNewExtent = route.routeResults[0].directions.extent;

    map.graphics.add(route.routeResults[0].route.setSymbol(routeSymbol));
    map.setExtent(myNewExtent, true);
}

dcoley

Thanks Steve,
What I'm finding is that the route is solving upon adding a third graphic, but the graphic route is not displaying on the map. For some reason the line symbol is simply not returning as a graphic. But thanks for looking at this. No luck on my end with your fix, but I certainly appreicate it-
David

evtguy

Your code looks like mine (I borrowed from a sample as well) but maybe you're trying to combine too many things together in your route symbol setup?

My (legacy) code is something like this:

function showRoute(solveResult) {
 routeSymbol = new esri.symbol.SimpleLineSymbol().setColor(new dojo.Color([255,0,0,0.8])).setWidth(4);
 
 theRoute = solveResult.routeResults[0].route;
 theRoute.setSymbol(routeSymbol);
 map.graphics.add(theRoute);

Only big difference I see is that you combined a few lines of code into your mapMain.graphics.Add() line of code.

Steve

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.