Layer Views

Intro

There are various react LayerView components available. Traditionally, accessing and manipulating the LayerView of a layer required imperative, asynchronous code:

let layer = new FeatureLayer(url);

map.add(layer);

view.whenLayerView(layer)
    .then(function(layerView){ ... })
    .catch(function(error){ ... });

With ESRIEACT, LayerView components are available that abstract away asynchronous paradigm, and react to prop/state updates. For example, a CSVLayer can take a CSVLayerView as a child:

const MyCsvMap = () => {
  const [selectedObjectIds, setSelectedObjectIds] = useState<string[]>([])

  return (
    <MapView {...props}>
      <CSVLayer url="https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/2.5_week.csv">
        <CSVLayerView featureEffect={{
          filter: {
            objectIds: selectedObjectIds
          },
          excludedEffect: "blur(5px) grayscale(90%) opacity(40%)"
        }} />
      </CSVLayer>
    </MapView>
  )
}

Or you may want to use the ref of a KMLLayerView to get its underlying map images:

const MyKmlMap = () => {
  const [kmlRef, setKmlRef] = useState<string[]>([])

  useEffect(() => {
    if (kmlRef) {
      console.log('Visible map images are:', kmlRef.allVisibleMapImages)
    }
  }, [kmlRef])

  return (
    <MapView {...props}>
      <KMLLayer url="http://quickmap.dot.ca.gov/data/lcs.kml">
        <KMLLayerView ref={r => setKmlRef(r)} />
      </KMLLayer>
    </MapView>
  )
}

FeatureLayerView

Must be a child of a <FeatureLayer />.

Props are equivalent to FeatureLayerView Props

ref is the instance of the underlying FeatureLayerView instance