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.
Skip To ContentArcGIS for DevelopersSign In Dashboard

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.

  • {}
  • Firefox
  • Safari
  • undefined

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

This sample demonstrates how a scale dependent drop-shadow feature effect set on a FeatureLayerView can be used to highlight counties where the winning party in a presidential election flipped from the previous election.

This map has two feature layers that show the winning parties by county in the 2012 and 2016 presidential elections. References to those layers and their layer views are set once the webmap is loaded. Once each layer view is initialized, we set a scale dependent feature effect on each one to highlight the counties where the winning party flipped for the presidential election that year.

// get 2012 and 2016 election layers when the view is initialized
// setup feature effects on the corresponding layer views
view.when().then(() => {
  // 2016 election layer
  const layer16 = webmap.layers.items[0];
  view.whenLayerView(layer16).then( (lv) => {
    applyFilter(lv, "F2012_to_2016_Party_Switch");

  // 2012 election layer
  const layer12 = webmap.layers.items[1];
  view.whenLayerView(layer12).then( (lv) => {
    applyFilter(lv, "F2008_to_2012_Party_Switch");

  // this function is called when layerViews are loaded
  // for 2012 and 2016 election results layers and called
  // once to set up the effects on the layer views to set
  // drop-shadow effect on counties where the winning parties
  // changed from the previous election
  function applyFilter(layerView, field) {
    const featureFilter = {
      where: `${field}='R' OR ${field}='D'`
    // set scale dependent drop-shadow effects on election results featurelayers
    layerView.effect = {
      filter: featureFilter,
      includedEffect: [
          scale: 36978595,
          value: "drop-shadow(3px, 3px, 4px)"
          scale: 18489297,
          value: "drop-shadow(2px, 2px, 3px)"
          scale: 4622324,
          value: "drop-shadow(1px, 1px, 2px)"

Sample search results