I am using the esri/request function to return an array of Long, Lat coordinates that I can then symbolize and add to a graphics layer. I have been able to successfully do this by creating the symbology and graphics within the stopsRequestSucceeded callback method. My issue is that I need to be able to repeat this call for approximately 15 different sets of data that would all need to be symbolized differently, and using the current method that I have working, I would have to write 15 different successful callback methods. To get around this I am trying to write two different functions. First, I narrowed the scope of the stopsRequestSucceeded method to push all the results to an array. This does work (at least according to my console.log statement. Next, I wrote a second function that would call the stopsRequestSucceeded function so that I can loop through the returned array and assign symbology and create a graphic. However, when I call the stopsRequestSucceeded function within the second, stopsGraphic function, the variable is empty. What am I doing wrong?
require([
"esri/map",
"esri/layers/ArcGISTiledMapServiceLayer",
"esri/layers/GraphicsLayer",
"esri/request",
"esri/symbols/SimpleMarkerSymbol",
"esri/graphic",
"esri/SpatialReference",
"esri/geometry/Point",
"esri/Color",
"esri/InfoTemplate",
"dojo/dom",
"dojo/on",
"dojo/dom-class",
"dojo/_base/json",
"dojox/mobile/Switch",
"dojo/parser",
"dojo/ready"],
function (Map,ArcGISTiledMapServiceLayer, GraphicsLayer, esriRequest,SimpleMarkerSymbol, Graphic, SpatialReference, Point, Color, InfoTemplate,
dom, on, domClass, dojoJson, Switch, parser, ready){
var map = new Map("map", {
basemap: "topo",
center: [-111.841947,40.765530],
zoom: 15
});
var stopsGraphicsLayer = new GraphicsLayer({
id: "stopsGraphicsLayer"
});
var vehicleLocationGraphicsLayer = new GraphicsLayer ({
id: "vehicleLocationGraphicsLayer"
});
var basemap = new ArcGISTiledMapServiceLayer ("https://fmags.fm.utah.edu/arcgis/rest/services/mapservices/public_basemap_2014/MapServer");
map.addLayer(basemap);
map.addLayer(vehicleLocationGraphicsLayer);
map.addLayer(stopsGraphicsLayer);
vehicleLocationGraphicsLayer.hide();
stopsGraphicsLayer.hide();
var vehicle = new Switch({
id: "vehicle",
value:"off",
class:"mblSwSquareShape"
});
vehicle.placeAt(document.body);
vehicle.startup();
vehicle.on("stateChanged",function(newstate){
if (newstate === "on"){
esriVehicleRequest(15);
esriStopRequest(15);
stopsGraphic(0,0,0);
}
else
{
vehicleLocationGraphicsLayer.hide();
stopsGraphicsLayer.clear();
stopsGraphicsLayer.hide();
}
});
function esriVehicleRequest(routeID){
var vehicleRequest = new esriRequest ({
url: "http://www.uofubus.com/Services/JSONPRelay.svc/GetMapVehiclePoints",
content: {
apikey: "ride1791",
routeID: routeID,
},
handleAs: "json",
callbackParamName: "method"
});
vehicleRequest.then(vehicleRequestSucceeded, requestFailed);
}
function vehicleRequestSucceeded(data) {
for (i=0; i < data.length; i++) {
console.log("Vehicle Points: ", data[i].Longitude , data[i].Latitude);
}
}
function esriStopRequest (routeID){
var stopsRequest = new esriRequest ({
url: "http://uofubus.com/Services/JSONPRelay.svc/GetStops",
content: {
apikey: "ride1791",
routeID: routeID,
},
handleAs: "json",
callbackParamName: "method"
});
stopsRequest.then(stopsRequestSucceeded, requestFailed);
}
function stopsRequestSucceeded(data){
var stopsArray = [];
for(i=0; i < data.length; i++){
stopsArray.push(data[i]);
}
console.log ("Stops Array:", stopsArray);
return stopsArray;
}
function stopsGraphic(color){
var stopObjects = stopsRequestSucceeded();
console.log(stopObject);
for(i=0; i < stopObjects.length; i++) {
var stopsSMS = new SimpleMarkerSymbol().setSize(15).setColor(new Color([color]));
var stops = new Graphic (new Point (stopObjects[i].Longitude, stopObjects[i].Latitude, map.SpatialReference), stopsSMS);
console.log(stops);
map.getLayer(stopsGraphicsLayer);
stopsGraphicsLayer.add(stops);
map.graphics.add(stops);
}
}
function requestFailed(error) {
console.log("Error: ", error.message);
}
});