javascriptreactjsarcgisarcgis-js-apiesri-maps

How to add layers to arcgis map by react-arcgis npm?


I am trying to add a layer to arcgis with react-arcgis npm,

esriPromise(["esri/layers/TileLayer"]).then(([ TileLayer ]) => {
            var initLayer = new TileLayer({
                url: "http://......."
            });
            console.log(initLayer);
            this.setState({ layer: initLayer });

        });

But I get null outputs to most of the properties.

Plus when I'm trying to add the layers properties to the map, I get following errors,

[esri.core.Accessor] Accessor#set Assigning an instance of 'esri.layers.TileLayer' which is not a subclass of 'esri.core.Collection'

<div id = 'main-content'>
  <Map
    class="full-screen-map"
    mapProperties={{
      basemap: 'topo',
      showLabels : true,
      logo: false,
      sliderPosition: 'bottom-left',
      layers: this.state.layer,
    }}
    viewProperties={{
      layers: this.state.layer,
      zoom: 12,
      extent: this.state.extent,
      minZoom: minZoom,
      maxZoom: maxZoom,
    }}
    onFail={this.handleFail}
    onLoad={this.handleMapLoad}
  />
</div>

Any help would be much appreciated...


Solution

  • Layers is a collection. I was passing a single layer it self all this time. All I had to do is make an array of 'layer' state and pass the layer to the array