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; } } }

featureLayerView: table-not-supported , table feature layer can't be displayed

Rohit_Venkat_GandhiMendadhala3

I am trying to create a featureLayer from an XML response where lat,lon are stored in a featureArray. Instead of creating this as point graphic, I would like to create them as a pointFeatureLayer. However, when I do that I get an error saying table feature layer cant be displayed. I am creating the featureLayer from featuresArray by loading it as FeatureLayerCollection containing lat,lon and id.
Here is the snapshot of the code, I have used.

   fetch(url,{
      method: 'GET',
      mode:'cors',
    }).then((response) => response.text())
    .then(str => new window.DOMParser().parseFromString(str, 'text/xml'))
    .then(async data => {
      const nodes = data.getElementsByTagName('tower');
      const featuresArray = [];
      for (const node of nodes){
          featuresArray.push({
            longitude: node.getAttribute('lng'),
            latitude: node.getAttribute('lat'),
            id:node.getAttribute('id')
          });
        }
      console.log(featuresArray);
      const featureLayer = await this.esri.FeatureLayer({
        source:featuresArray,
        objectIdField:'id',
        title:'TestLayer'
      });
      this.mvs.addToMap(featureLayer);

Encontre mais publicações marcadas com

Accepted answers

ReneRubalcava

Do the check on both values like !isNaN(obj.geometry.latitude) && !isNaN(obj.geometry.longitude)

All comments

ReneRubalcava

Do the check on both values like !isNaN(obj.geometry.latitude) && !isNaN(obj.geometry.longitude)

Rohit_Venkat_GandhiMendadhala3

Yes, I expected that. So here is NaN value I found.

Is there a way to filter this down.. I did something like this.

featuresArray = featuresArray.filter((obj)=> !isNaN(obj.geometry.latitude || obj.geometry.longitude))

JoelBennett

Is it really just one point, or a load of points stacked on one another? If it is just one point, I would recommend autogenerating the objectID values as in a previous response.

As for the wrong location, it looks like it's treating your long/lat values as Web Mercator x/y values. You may have to project the coordinates into Web Mercator, which is easily done with webMercatorUtils.lngLatToXY and then use "x" and "y" properties instead of "latitude" and "longitude".

ReneRubalcava

There could be some invalid data. If I add NaN values to coords, no points will display. The one valid point will display if you change to NaN to null though.

https://codepen.io/odoe/pen/ZEVdNBJ?editors=1000

You might need to filter the data to validate it before you create the layer.

Rohit_Venkat_GandhiMendadhala3

Ok, I have just changed the id to a diff field and it loads just one point, that too with a mismatch of spatial reference. Any recommendations on this?

Rohit_Venkat_GandhiMendadhala3

Well, I did that too

JoelBennett

It was good to convert the lat and long to numbers as Rene suggested, but I see in your screenshot the "id" values are still strings. I've seen features not render in cases of duplicate or invalid objectid values, so you should probably convert those to integers as well, whether via Number or parseInt.

Rohit_Venkat_GandhiMendadhala3

No errors, code runs fine but layer doesnt display (points dont show up). The title displays in the map options, but points do not show up. Unfortunately, this is part of a big code base, cant upload the codebase

Rohit_Venkat_GandhiMendadhala3

Well I tried that, but it didnt work as well.

Here is sample of the featuresArray.

ReneRubalcava

Try to wrap your coords in Number(node.getAttribute('lng')), see if that helps. Although I think you would get a different error if the coords as string was an issue. What if you assign the y/x instead of lat/lon?

If you had a small sample in codepen or similar to debug, would help.

Rohit_Venkat_GandhiMendadhala3

Tried that, but didnt work. The graphics do not load. I am wondering if there is a need to set symbol like this and even it didnt work.

featuresArray.push({
            geometry:{
              longitude: node.getAttribute('lng'),
              latitude: node.getAttribute('lat'),
              type:'point'
            },
            symbol: {
              type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
              color: "blue",
              size: 10,
              outline: { // autocasts as new SimpleLineSymbol()
                width: 0.5,
                color: "darkblue"
              }
            },
            attributes:{
              id:parseInt(node.getAttribute('id'),10)
            }
          });

JoelBennett

It may be because the ObjectID values are expected to be numeric, so you might need to use the following instead:

		attributes: {
			id: parseInt(node.getAttribute("id"), 10)
		}

or you could also generate your own:

var oid = 1;

for (const node of nodes) {
	featuresArray.push({
		geometry: {
			longitude: node.getAttribute("lng"),
			latitude: node.getAttribute("lat"),
			type: "point"
		},
		attributes: {
			id: oid++,
			featureID: node.getAttribute("id")
		}
	});
}

Rohit_Venkat_GandhiMendadhala3

Thank you, that worked ok to resolve the error. However the points do not display or load on the webmap.

JoelBennett

I think the problem lies in the structure of the objects in your featuresArray. Perhaps try the following instead:

for (const node of nodes) {
	featuresArray.push({
		geometry: {
			longitude: node.getAttribute("lng"),
			latitude: node.getAttribute("lat"),
			type: "point"
		},
		attributes: {
			id: node.getAttribute("id")
		}
	});
}

Participe da Conversa

Membros conectados podem postar, seguir atualizações e mais. Novo aqui? Registre uma conta gratuita.

Links Rápidos

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