GeoJson to FeatureLayer using Terraformer

1996
1
Jump to solution
05-31-2018 06:36 AM
Oliver_Burdekin
Occasional Contributor II

I'm trying to convert a geoJSON to ESRI JSON (ultimately to create a FeatureLayer for use in a web map). I'm using the javascript API 3.24.

My original geoJSON looks like this:

{
  "type": "FeatureCollection",
  "features": [
    {
      "type": "Feature",
      "geometry": {
        "type": "Polygon",
        "coordinates": [
          [
            [
              7.3868103070001,
              6.0366749930001
            ],
            [‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

 ..... etc etc

I've checked to see if this is properly formed using JSONlint and by bringing it into a GIS. All good there.

I've then used Terraformer to convert the above into the ESRI JSON format using

Terraformer.ArcGIS.convert(geojsonData);‍‍

 

This appears to work but looking at the returned object it looks like this:

[
  {
    "geometry": {
      "rings": [
        [
          [
            7.3868103070001,
            6.0366749930001
          ],
          [
            7.3872861030001,
            6.036048758
          ],
          [
            7.3888583080001,
            6.0361989570001
          ],‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

 

etc... etc... until

      ],
      "spatialReference": {
        "wkid": 4326
      }
    },
    "attributes": {
      "OBJECTID": 1,
      "admin": "Abia"
    }
  },‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

etc...etc...

Again I've checked the above with JSONlint and it appears to be valid. However, it is missing some of the ESRI JSON structure I was expecting (geometry type, fields etc)

When I try to set this ESRI JSON to a FeatureLayer I've included a layer definition but I'm still getting a spurious error. The code I'm using to create the FeatureLayer is as follows:

     var request = esriRequest({
          url: "php/getStates.php",
          handleAs: "json"
     });

     function requestSucceeded(data) {
          
          // use terraformer to convert geojson to ESRIjson
          var arcdata = Terraformer.ArcGIS.convert(data);

          var featureCollection = {
               layerDefinition: {
                    "geometryType": "esriGeometryPolygon",
                    "fields": [{
                         "name": "OBJECTID",
                         "type": "esriFieldTypeOID",
                         "alias": "OBJECTID"
                    },
                    {
                         "name": "admin",
                         "type": "esriFieldTypeString",
                         "alias": "admin"
                    }],
               },
               featureSet : arcdata
          };

          var fl = new FeatureLayer(featureCollection, {
               mode: FeatureLayer.MODE_SNAPSHOT,
               outFields: ['OBJECTID', 'admin']
          });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

I'd like to know what might be going wrong here. The spurious error mentioned above is:

TypeError: b is undefined  _addFeatures@https://js.arcgis.com/3.24/:2256:226  

This is the first time I've looked properly into the js API so forgive me if this is an obvious blunder.

0 Kudos
1 Solution

Accepted Solutions
Oliver_Burdekin
Occasional Contributor II

Okay, I worked it out. As I thought... obvious blunder. This reply by Jake Skinner‌ was the key.

Terraformer was taking my geoJSON and converting it to ESRI JSON features. But geometry type and spatial reference had not been set (nor had fields etc).

So before creating a feature collection I needed to make a feature set. To ensure the feature set had geom type and spatial reference set I made a new json using the Terraformed features.

I then made a feature set using that json and from there made a feature collection. Create a style for the renderer, render, add to map. Here's the code:

     var request = esriRequest({
          url: "php/getStates.php",
          handleAs: "json"
     });

     function requestSucceeded(data) {
          
          // use terraformer to convert geojson to ESRIjson
          var arcdata = Terraformer.ArcGIS.convert(data);

          // create a json with geom and sr using ESRIjson feature
          var jsonFS = {
               "geometryType" : "esriGeometryPolygon",
               "spatialReference" : {
                    "wkid" : 4326
               },
               "features": arcdata
          };

          var fs = new FeatureSet(jsonFS);

          var featureCollection = {
               layerDefinition: {
                    "geometryType": "esriGeometryPolygon",
                    "spatialReference" : {
                         "wkid" : 4326
                    }, 
                    "fields": [{
                         "name": "OBJECTID",
                         "type": "esriFieldTypeOID",
                         "alias": "OBJECTID"
                    },
                    {
                         "name": "admin",
                         "type": "esriFieldTypeString",
                         "alias": "admin"
                    }],
               },
               featureSet : fs
          };

          // create FeatureLayer from the FeatureCollection
          var fl = new FeatureLayer(featureCollection, {
               mode: FeatureLayer.MODE_SNAPSHOT,
               outFields: ['OBJECTID', 'admin']
          });

          // create symbol for rendering
          var symbol = new SimpleFillSymbol(
               SimpleFillSymbol.STYLE_SOLID,
               new SimpleLineSymbol(
                    SimpleLineSymbol.STYLE_SOLID,
                    new Color([255,255,255,0.35]),
                    1
                    ),
               new Color([125,125,125,0.35])
               );

          fl.setRenderer(new SimpleRenderer(symbol));

          map.addLayer(fl);
     }

View solution in original post

1 Reply
Oliver_Burdekin
Occasional Contributor II

Okay, I worked it out. As I thought... obvious blunder. This reply by Jake Skinner‌ was the key.

Terraformer was taking my geoJSON and converting it to ESRI JSON features. But geometry type and spatial reference had not been set (nor had fields etc).

So before creating a feature collection I needed to make a feature set. To ensure the feature set had geom type and spatial reference set I made a new json using the Terraformed features.

I then made a feature set using that json and from there made a feature collection. Create a style for the renderer, render, add to map. Here's the code:

     var request = esriRequest({
          url: "php/getStates.php",
          handleAs: "json"
     });

     function requestSucceeded(data) {
          
          // use terraformer to convert geojson to ESRIjson
          var arcdata = Terraformer.ArcGIS.convert(data);

          // create a json with geom and sr using ESRIjson feature
          var jsonFS = {
               "geometryType" : "esriGeometryPolygon",
               "spatialReference" : {
                    "wkid" : 4326
               },
               "features": arcdata
          };

          var fs = new FeatureSet(jsonFS);

          var featureCollection = {
               layerDefinition: {
                    "geometryType": "esriGeometryPolygon",
                    "spatialReference" : {
                         "wkid" : 4326
                    }, 
                    "fields": [{
                         "name": "OBJECTID",
                         "type": "esriFieldTypeOID",
                         "alias": "OBJECTID"
                    },
                    {
                         "name": "admin",
                         "type": "esriFieldTypeString",
                         "alias": "admin"
                    }],
               },
               featureSet : fs
          };

          // create FeatureLayer from the FeatureCollection
          var fl = new FeatureLayer(featureCollection, {
               mode: FeatureLayer.MODE_SNAPSHOT,
               outFields: ['OBJECTID', 'admin']
          });

          // create symbol for rendering
          var symbol = new SimpleFillSymbol(
               SimpleFillSymbol.STYLE_SOLID,
               new SimpleLineSymbol(
                    SimpleLineSymbol.STYLE_SOLID,
                    new Color([255,255,255,0.35]),
                    1
                    ),
               new Color([125,125,125,0.35])
               );

          fl.setRenderer(new SimpleRenderer(symbol));

          map.addLayer(fl);
     }