Points are not getting plotted even though the data is getting fetched from the api.

1434
9
04-28-2021 07:18 AM
SahilBansal
New Contributor II

Hi,

The points are not getting plotted even though the data is coming form the calling API. I am trying to plot the points based on the latitude and longitude coming via an API. I can see the data in the console but its not getting plotted while calling this function.

PFB the code snippet:

const getpoints = () => {
    view.graphics.removeAll();
    , ).subscribe({
      next: (data=> {
        console.log('data of lat long is 'data);
        data.forEach((resultany=> {
          console.log('my result is'result);
          const latlongpoint = {
            // Create a point
            // @ts-ignore
            type: 'point',
            longitude: result.lng,
            latitude: result.lat,
          };
          console.log('what is my latlongpoint'latlongpoint);
          locationlist.push(latlongpoint);
          addGraphic('cross'latlongpoint);
          });
      },
      error: (error=> {
        console.error('There was an error while fetcing latitude and longitude data'error);
        return error;
      },
    });
};

    view.on('click'getpoints);
0 Kudos
9 Replies
ReneRubalcava
Frequent Contributor

what does your addGraphic method look like?

0 Kudos
SahilBansal
New Contributor II

sorry forgot to add that

 

const addGraphic = (typeanypointany=> {
      const graphic = new Graphic ({
        symbol: new SimpleMarkerSymbol({
          color: 'black',
          style: 'square',
          size: '15px',
          outline: {
            // autocasts as new SimpleLineSymbol()
            color: [2552550],
            width: 3// points
          },
        }),
        geometry: point,
      });
      view.graphics.add(graphic);
    };
0 Kudos
JohnGrayson
Esri Regular Contributor

Hard to tell what is going on; do you have a very simple codepen (or similar) so we can experience the issue?  My guess is that maybe the result.lng and result.lat values are strings instead of numbers, or maybe the values represent X and Y instead of longitude and latitude?

0 Kudos
SahilBansal
New Contributor II

I did the same thing in react application and its working fine over there with the same code.

0 Kudos
SahilBansal
New Contributor II

This is what i am getting in my console.

SahilBansal_0-1619633403424.png

0 Kudos
ReneRubalcava
Frequent Contributor

add an attribute to your graphic, even if it's an empty object, that might fix it. new Graphic({attributes: {}, geometry});

0 Kudos
SahilBansal
New Contributor II

I added the attributes to the graphic function but still its not plotting the points.

0 Kudos
SahilBansal
New Contributor II

Can anyone please help me here!

0 Kudos
JohnGrayson
Esri Regular Contributor

Hard to tell what is going on; do you have a very simple codepen (or similar) so we can experience the issue? 
Not sure, but in the screenshot the lat/lon values display as strings, so maybe try converting them to numbers?

example: Number(result.lng)

0 Kudos