You are using a browser that is no longer supported. Please use the latest version of Google Chrome, Mozilla Firefox, Apple Safari, or Microsoft Edge. For more information please see the System Requirements.

Unsupported browser

You are using a browser that is not supported. JavaScript API works on the latest versions of Google Chrome, Mozilla Firefox, Apple Safari, or Microsoft Edge. Use one of these browsers and provide your feedback through GeoNet, the Esri Community.

  • {i18n.unsupportedBrowser.chrome}
  • Firefox
  • Safari
  • undefined
Loading...

Note: Support for 3D on mobile devices may vary, view the system requirements for more information.

This sample demonstrates how you can use spatial relationships to discover how features are spatially related to each other. It sets an effect on layers to show the features meet the spatial filter while graying out the features that do not meet the spatial filter. This can be done by creating a new FeatureEffect and specifying its filter and excludedEffect properties. The effect object can then be applied to the layer view's effect property.

How it works

Once the application loads, user can select:

  • Layer - to set a spatial filter on
  • Predefined geometry - to see how features from the layer are spatially related to this geometry
  • Spatial relationship - to specify type of spatial relationship you want to see between the geometries
  • Distance - to create a buffer around the predefined geometry and use the buffer to do spatial filter
  • Unit - specifies the distance unit to apply to the buffer

The layer will be updated as user makes selections to show features that are included in the spatial filter while dimming out the features that are excluded from the spatial filter.

// set the geometry filter on the visible FeatureLayerView
function updateFilter() {
  featureFilter = {
    // autocasts to FeatureFilter
    geometry: filterGeometry,
    spatialRelationship: geometryRel,
    distance: distance,
    units: unit
  };
  // set effect on excluded features
  // make them gray and transparent
  if (featureLayerView) {
    featureLayerView.effect = {
      filter: featureFilter,
      excludedEffect: "grayscale(100%) opacity(30%)"
    };
  }
}

Sample search results

TitleSample
Loading...