Error while creating a FeatureLayer from a GeoJSON source in Web AppBuilder

LUCCLAUSTRES — Sat, 11 Dec 2021 13:27:52 GMT

I followed this sample implementing GeoJSON import "Create a FeatureLayer with client side graphics | ArcGIS API for JavaScript 4.3" but I am stucked on the following error that appears when creating the FeatureLayer : "TypeError: Cannot read property 'path' of null". The GeoJSON data seem to be correctly retrieved however, here is my code :

var adsbRenderer = new SimpleRenderer({
            symbol: new SimpleMarkerSymbol({
              size: 10,
              color: "#FF4000",
              outline: {
                color: [255, 64, 0, 0.4],
                width: 7
              }
            })
          });

          // Tentative with GeoJSON
          // Raise error when creating the FeatureLayer object : "TypeError: Cannot read property 'path' of null"
          esriRequest({
            url: this.config.adsb.adsbBaseUrl,
            content: {
              service: 'WFS',
              version: '1.0.0',
              request: 'GetFeature',
              typeName: 'adsb-docker:aircrafts',
              outputFormat: 'application/json',
              CQL_FILTER: 'opicao=\'EZY\''
            },
            handleAs: 'json'
          }).then(function(geoJson) {
            // Create an array of Graphics from each GeoJSON feature
            return arrayUtils.map(geoJson.features, function(feature, i) {
              return {
                geometry: new Point({
                  x: feature.geometry.coordinates[0],
                  y: feature.geometry.coordinates[1]
                }),
                // select only the attributes you care about
                attributes: {
                  id: feature.id,
                  icao: feature.properties.icao,
                  op: feature.properties.op,
                  opicao: feature.properties.opicao,
                  time: feature.properties.time,
                  man: feature.properties.man,
                  mdl: feature.properties.mdl
                }
              };
            });
          }).then(function(graphics) {
            // Define the specification for each field to create
            var fields = [
            {
              name: "id",
              alias: "id",
              type: "oid"
            }, {
              name: "icao",
              alias: "icao",
              type: "string"
            }, {
              name: "op",
              alias: "op",
              type: "string"
            }, {
              name: "opicao",
              alias: "opicao",
              type: "string"
            }, {
              name: "man",
              alias: "man",
              type: "string"
            }, {
              name: "time",
              alias: "time",
              type: "date"
            }, {
              name: "mdl",
              alias: "mdl",
              type: "string"
            }];
            // Set up popup template for the layer
            var pTemplate = {
              title: "{icao}",
              content: [{
                type: "fields",
                fieldInfos: [{
                  fieldName: "op",
                  label: "Op",
                  visible: true
                }, {
                  fieldName: "opicao",
                  label: "Op Icao",
                  visible: true
                }, {
                  fieldName: "time",
                  label: "Date and time",
                  visible: true
                }, {
                  fieldName: "man",
                  label: "Manufacturer",
                  visible: true
                }, {
                  fieldName: "mdl",
                  label: "Model",
                  visible: true
                }]
              }],
              fieldInfos: [{
                fieldName: "time",
                format: {
                  dateFormat: "short-date-short-time"
                }
              }]
            };
            this.adsbLayer = new FeatureLayer({
              source: graphics, // autocast as an array of esri/Graphic
              // create an instance of esri/layers/support/Field for each field object
              fields: fields, // This is required when creating a layer from Graphics
              objectIdField: "id", // This must be defined when creating a layer from Graphics
              renderer: adsbRenderer, // set the visualization on the layer
              spatialReference: {
                wkid: 4326
              },
              geometryType: "point", // Must be set when creating a layer from Graphics
              popupTemplate: pTemplate
            });
            
            this.map.addLayer(this.adsbLayer);
          }).otherwise(function(error) {
            console.error("Creating ADSB layer failed. ", error);
          });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Error while creating a FeatureLayer from a GeoJSON source in Web AppBuilder

MortenFriesgaard — Sat, 11 Dec 2021 13:27:55 GMT

Hi,

Maybe this is a bit late, but I got it working by wrapping configuration for the FeatureLayer in a featureCollection object like on this page: FeatureLayer | API Reference | ArcGIS API for JavaScript 3.23

var featureCollection = {
  layerDefinition: {
    fields: fields,
    source: graphics, 
    objectIdField: "ObjectID", 
    renderer: absRenderer,
    spatialReference: {
      wkid: 4326
    },
    geometryType: "point",
    popupTemplate: pTemplate
  },
  featureSet: null
};

lyr = new FeatureLayer(featureCollection);

Re: Error while creating a FeatureLayer from a GeoJSON source in Web AppBuilder

MortenFriesgaard — Wed, 24 Jan 2018 12:10:39 GMT

When I debug my code, I'm quite sure you also tried to setup this sample in a environment pre 4.0 (e.g. 3.23). To get this to work, using featureCollection is completly correct. Follow this example instead:

Feature collection | ArcGIS API for JavaScript 3.23

topic Re: Error while creating a FeatureLayer from a GeoJSON source in Web AppBuilder in ArcGIS Web AppBuilder Questions

Error while creating a FeatureLayer from a GeoJSON source in Web AppBuilder

Re: Error while creating a FeatureLayer from a GeoJSON source in Web AppBuilder

Re: Error while creating a FeatureLayer from a GeoJSON source in Web AppBuilder