Select to view content in your preferred language

How to access data in array after Promise

1414
3
Jump to solution
11-22-2022 08:03 AM
JohnRitsko1
New Contributor III

I tried to revive this thread below but to no luck.  Rene has helped me quite a bit but I'm stuck getting values out of a promise statement that puts values into an array.

Previous Post: https://community.esri.com/t5/arcgis-api-for-javascript-questions/executing-a-series-of-queries-insi...

 

My code hits the swiftly API to get a list of closed bus stops.  This list of stops does not include a lat / lon value so what I do is then query the closedStop Feature class using the bus stop ID from the API in order t join these two results together.  I then have an array "RESULTS" but can't get into the promise.  I can see the values (see attached image array.png).  Just not sure how to get those out of the array.  

Input is greatly appreciated.

 

    BTNelement.addEventListener('click', function(evt){
      view.graphics.removeAll(); // Clears all graphics before placing new updated ones onto the view
        var settings = {
          "url": 'https://api.goswift.ly/',
          "method": "GET",
          "timeout": 0,
          "headers": {
            "Authorization": "",
            "Content-Type": "application/json"
          }
        };
        $.ajax(settings).done(function (response) {  
          console.log("Number of Closed Stops: " + response.adjustments.length);

          loadData(response);

          async function loadData(response) {
            var i = 0;
            
            const queryPromises = response.adjustments.map((data) => {
              // parse data for query              
              const query = new Query();
              var queryValue = "Id = " + data.details.stopIds;                
              query.where =  queryValue;
              query.outFields = ["*"];
              query.returnGeometry = false;
              apiStopNumber = data.details.stopIds;
              routeAffected = data.details.routesAffected;
              notes = data.notes;
              reason = data.reason;
              i++;
              return [ClosedBusStops.queryFeatures(query), routeAffected, notes, reason, apiStopNumber];
            });          
            
            const resultsArray = await Promise.allSettled(queryPromises);            
            // you now have an array of arrays for results, you can flatten them
            const results = resultsArray.flat();            
            // now you can create the graphics from the results
            //console.log(results);       
            doStuff(results);


          };

          



        }); 
    });

    function doStuff(results){
            console.log(results);       
          };

 

Tags (3)
0 Kudos
1 Solution

Accepted Solutions
JohnRitsko1
New Contributor III

SOLUTION:

 

$.ajax(settings).done(function (response) {          
        //console.log("Number of Closed Stops: " + response.adjustments.length);
        
        loadData(response);

        //---------------------------------------------------------------------------
        async function loadData(response) {   
          var xValue = 0;
          var yValue = 0;        

          const queryPromises = response.adjustments.map((response) => {
            const apiStopNumber = response.details.stopIds;
            const routeAffected = response.details.routesAffected;
            const notes = response.notes;
            const reason = response.reason;
            var pictureSymbol = {
              type: "picture-marker",
              url:"img/closedStop.jpg",
              height: 20,
              width: 20  
            };                    
            let query = ClosedBusStops.createQuery();            
            query.where =  "Id = " + apiStopNumber;
            query.outFields = ["Xcoord, Ycoord"];
            query.returnGeometry = false;

            ClosedBusStops.queryFeatures(query)
              .then(function(queryResponse) {               
                if (queryResponse.features.length !== 0) {
                  xValue = queryResponse.features[0].attributes.Xcoord;
                  yValue = queryResponse.features[0].attributes.Ycoord;                  
                  const busStop = new Point({
                    type: "point",
                    longitude: xValue,
                    latitude: yValue,
                    wkid: 4326 
                  });
                  popupClosedBusStops = {
                    title: "Bus Stop: " + apiStopNumber,
                    content:"<b>Route(s) Impacted: </b>" + routeAffected + "<br/>" + 
                      "<b>Notes: </b>" + notes + "<br/>" + 
                      "<b>Reason: </b>" + reason
                  };
                  const busStopGraphic = new Graphic ({
                              geometry: busStop,
                              symbol: pictureSymbol,
                              popupTemplate: popupClosedBusStops
                          });

                  view.graphics.add(busStopGraphic);
                }
                else{
                  //console.log("Inactive Stop")
                };
            });
          });
        }; // End of async function loadData 
      }); // End of Ajax Call
    });

View solution in original post

0 Kudos
3 Replies
JohnRitsko1
New Contributor III

Please see the Issue.png file.  Perhaps I'm going about this wrong.  My issue is accessing the lat/lon within the results I get back.  I can get say the Bus Stop number using results[0].value[1].  However, it's when I try to get values from within the ResultsPromise that I can't seem to figure out.  The Issue.png shows the lat/lon but I can't put together how to get that data, i.e.  results[0].[0].PromiseResults.features[0].attributes.Xcoord and subsequently results[0].[0].PromiseResults.features[0].attributes.Ycoord. 

0 Kudos
JohnRitsko1
New Contributor III

Still hoping someone can chime in on how to get the variables in the issue.png file I show above.  The values in the Promise I'm not sure how to access.   Thank you.

0 Kudos
JohnRitsko1
New Contributor III

SOLUTION:

 

$.ajax(settings).done(function (response) {          
        //console.log("Number of Closed Stops: " + response.adjustments.length);
        
        loadData(response);

        //---------------------------------------------------------------------------
        async function loadData(response) {   
          var xValue = 0;
          var yValue = 0;        

          const queryPromises = response.adjustments.map((response) => {
            const apiStopNumber = response.details.stopIds;
            const routeAffected = response.details.routesAffected;
            const notes = response.notes;
            const reason = response.reason;
            var pictureSymbol = {
              type: "picture-marker",
              url:"img/closedStop.jpg",
              height: 20,
              width: 20  
            };                    
            let query = ClosedBusStops.createQuery();            
            query.where =  "Id = " + apiStopNumber;
            query.outFields = ["Xcoord, Ycoord"];
            query.returnGeometry = false;

            ClosedBusStops.queryFeatures(query)
              .then(function(queryResponse) {               
                if (queryResponse.features.length !== 0) {
                  xValue = queryResponse.features[0].attributes.Xcoord;
                  yValue = queryResponse.features[0].attributes.Ycoord;                  
                  const busStop = new Point({
                    type: "point",
                    longitude: xValue,
                    latitude: yValue,
                    wkid: 4326 
                  });
                  popupClosedBusStops = {
                    title: "Bus Stop: " + apiStopNumber,
                    content:"<b>Route(s) Impacted: </b>" + routeAffected + "<br/>" + 
                      "<b>Notes: </b>" + notes + "<br/>" + 
                      "<b>Reason: </b>" + reason
                  };
                  const busStopGraphic = new Graphic ({
                              geometry: busStop,
                              symbol: pictureSymbol,
                              popupTemplate: popupClosedBusStops
                          });

                  view.graphics.add(busStopGraphic);
                }
                else{
                  //console.log("Inactive Stop")
                };
            });
          });
        }; // End of async function loadData 
      }); // End of Ajax Call
    });
0 Kudos