PROSAGA码农传奇-时空索引-如何使用javascript API在arcgis地图上绘制路线？

<div class =“post-text”itemprop =“text”>
  <P>
    这是一种方法，假设您正在使用ArcGIS API for JavaScript 4.2版（如果您仍然使用3.x，则可以使用类似的方法）。
  </p>
   <pre>
    <code>
      <!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>VRP Graphics</title>
  <style>
    html,
    body,
    #viewDiv {
      padding: 0;
      margin: 0;
      height: 100%;
      width: 100%;
    }
  </style>

/**
       * Require the modules needed to do the graphics. Don't forget to
       * include them as function parameters a few lines down as well!
       */
      "dojo/_base/array",
      "esri/Graphic",
      "esri/symbols/SimpleLineSymbol",

"dojo/domReady!"
    ], function(Map, MapView, array, Graphic, SimpleLineSymbol) {

/**
       * You're getting the JSON from the VRP service. Here I'm just including
       * your JSON response as a variable. You won't do this.
       */
      var responseJson = {         "paramName": "out_routes",         "dataType": "GPFeatureRecordSetLayer",         "value": {             "displayFieldName": "",             "geometryType": "esriGeometryPolyline",             "spatialReference": {                 "wkid": 4326,                 "latestWkid": 4326             },             "fields": [                 {                     "name": "ObjectID",                     "type": "esriFieldTypeOID",                     "alias": "ObjectID"                 },                 {                     "name": "Name",                     "type": "esriFieldTypeString",                     "alias": "Name",                     "length": 128                 },                 {                     "name": "ViolatedConstraints",                     "type": "esriFieldTypeInteger",                     "alias": "ViolatedConstraints"                 },                 {                     "name": "OrderCount",                     "type": "esriFieldTypeInteger",                     "alias": "OrderCount"                 },                 {                     "name": "TotalCost",                     "type": "esriFieldTypeDouble",                     "alias": "TotalCost"                 },                 {                     "name": "RegularTimeCost",                     "type": "esriFieldTypeDouble",                     "alias": "RegularTimeCost"                 },                 {                     "name": "OvertimeCost",                     "type": "esriFieldTypeDouble",                     "alias": "OvertimeCost"                 },                 {                     "name": "DistanceCost",                     "type": "esriFieldTypeDouble",                     "alias": "DistanceCost"                 },                 {                     "name": "TotalTime",                     "type": "esriFieldTypeDouble",                     "alias": "TotalTime"                 },                 {                     "name": "TotalOrderServiceTime",                     "type": "esriFieldTypeDouble",                     "alias": "TotalOrderServiceTime"                 },                 {                     "name": "TotalBreakServiceTime",                     "type": "esriFieldTypeDouble",                     "alias": "TotalBreakServiceTime"                 },                 {                     "name": "TotalTravelTime",                     "type": "esriFieldTypeDouble",                     "alias": "TotalTravelTime"                 },                 {                     "name": "TotalDistance",                     "type": "esriFieldTypeDouble",                     "alias": "TotalDistance"                 },                 {                     "name": "StartTime",                     "type": "esriFieldTypeDate",                     "alias": "StartTime",                     "length": 16                 },                 {                     "name": "EndTime",                     "type": "esriFieldTypeDate",                     "alias": "EndTime",                     "length": 16                 },                 {                     "name": "TotalWaitTime",                     "type": "esriFieldTypeDouble",                     "alias": "TotalWaitTime"                 },                 {                     "name": "TotalViolationTime",                     "type": "esriFieldTypeDouble",                     "alias": "TotalViolationTime"                 },                 {                     "name": "RenewalCount",                     "type": "esriFieldTypeInteger",                     "alias": "RenewalCount"                 },                 {                     "name": "TotalRenewalServiceTime",                     "type": "esriFieldTypeDouble",                     "alias": "TotalRenewalServiceTime"                 },                 {                     "name": "Shape_Length",                     "type": "esriFieldTypeDouble",                     "alias": "Shape_Length"                 }             ],             "features": [                 {                     "attributes": {                         "ObjectID": 1,                         "Name": "Truck_1",                         "ViolatedConstraints": null,                         "OrderCount": 2,                         "TotalCost": 55.12577115597857,                         "RegularTimeCost": 32.368821966275576,                         "OvertimeCost": 0,                         "DistanceCost": 22.756949189702993,                         "TotalTime": 161.84410983137786,                         "TotalOrderServiceTime": 49,                         "TotalBreakServiceTime": 0,                         "TotalTravelTime": 52.844109831377864,                         "TotalDistance": 15.171299459801997,                         "StartTime": 1355241600000,                         "EndTime": 1355251310647,                         "TotalWaitTime": 0,                         "TotalViolationTime": 0,                         "RenewalCount": 0,                         "TotalRenewalServiceTime": 0,                         "Shape_Length": 0.27770417275136994                     },                     "geometry": {                         "paths": [                             [                                 [                                     -122.39476499860575,                                     37.79623499914595                                 ],                                 [                                     -122.39486000028876,                                     37.79632999992958                                 ]                             ],                             [                                 [                                     -122.46491587646648,                                     37.77469887205535                                 ],                                 [                                     -122.4648300002043,                                     37.77348999976374                                 ]                             ]                         ]                     }                 },                 {                     "attributes": {                         "ObjectID": 2,                         "Name": "Truck_2",                         "ViolatedConstraints": null,                         "OrderCount": 2,                         "TotalCost": 58.98111973045911,                         "RegularTimeCost": 31.262990736961367,                         "OvertimeCost": 0,                         "DistanceCost": 27.71812899349775,                         "TotalTime": 156.31495368480682,                         "TotalOrderServiceTime": 43,                         "TotalBreakServiceTime": 0,                         "TotalTravelTime": 53.314953684806824,                         "TotalDistance": 18.478752662331832,                         "StartTime": 1355241600000,                         "EndTime": 1355250978897,                         "TotalWaitTime": 0,                         "TotalViolationTime": 0,                         "RenewalCount": 0,                         "TotalRenewalServiceTime": 0,                         "Shape_Length": 0.30798071724323045                     },                     "geometry": {                         "paths": [                             [                                 [                                     -122.39476499860575,                                     37.79623499914595                                 ],                                 [                                     -122.39486000028876,                                     37.79632999992958                                 ]                             ],                             [                                 [                                     -122.47389692820065,                                     37.74313425554152                                 ],                                 [                                     -122.47462999977466,                                     37.74310000036479                                 ]                             ]                         ]                     }                 },                 {                     "attributes": {                         "ObjectID": 3,                         "Name": "Truck_3",                         "ViolatedConstraints": null,                         "OrderCount": 2,                         "TotalCost": 59.96986647554318,                         "RegularTimeCost": 28.12653774395585,                         "OvertimeCost": 0,                         "DistanceCost": 31.843328731587327,                         "TotalTime": 140.63268871977925,                         "TotalOrderServiceTime": 38,                         "TotalBreakServiceTime": 0,                         "TotalTravelTime": 42.63268871977925,                         "TotalDistance": 21.228885821058217,                         "StartTime": 1355241600000,                         "EndTime": 1355250037961,                         "TotalWaitTime": 0,                         "TotalViolationTime": 0,                         "RenewalCount": 0,                         "TotalRenewalServiceTime": 0,                         "Shape_Length": 0.3486039472893737                     },                     "geometry": {                         "paths": [                             [                                 [                                     -122.39476499860575,                                     37.79623499914595                                 ],                                 [                                     -122.39486000028876,                                     37.79632999992958                                 ]                             ],                             [                                 [                                     -122.44930025350385,                                     37.731549383197546                                 ],                                 [                                     -122.45112999974964,                                     37.73153999967133                                 ]                             ]                         ]                     }                 }             ],             "exceededTransferLimit": false         }       };

var map = new Map({
        basemap: "streets"
      });

var view = new MapView({
        container: "viewDiv",
        map: map,
        zoom: 14,
        center: [-122.452, 37.750]
      });

/**
       * Create a line symbol for the graphics.
       */
      var lineSymbol = new SimpleLineSymbol({
        color: [255, 255, 0],
        width: 4
      });

/**
       * Loop through the JSON object's value.features array. For each one,
       * create a Graphic and add it to the map.
       */
      array.forEach(responseJson.value.features, function (feature) {
        feature.symbol = lineSymbol;
        var graphic = Graphic.fromJSON(feature);
        graphic.symbol = lineSymbol;
        view.graphics.add(graphic);
      }, this);

});
  </script>
</head>

</code>
  </pre>
</DIV>