Feature Reduction Binning

Binning aggregates point data to polygons, thus summarizing the density of data. This can be an effective method for visualizing large datasets.

Referenced by: Feature Reduction

Properties

Property Details
binType Determines the type or shape of bins used in the aggregation.
Valid values:
  • flatHexagon
  • geohash
  • pointyHexagon
  • square
disablePopup Indicates whether to disable popups describing aggregate data in a binning visualization.
drawingInfo Contains labeling and rendering information for the bins.
fields[] An array of objects defining the aggregate fields to use in binning popups, labels, and renderers.
fixedBinLevel Indicates the fixed geohash level used to create bins. When defined, bins defined at this level are static and do not regenerate on zoom. When undefined, bin resolution will vary as you zoom in and out. Dynamically changing bin resolution on zoom is currently not supported on web clients.
popupInfo Defines the popup used to describe aggregate data in the selected bin.
showLabels Defines whether labels should be shown in the bins.
type Type of feature reduction.
Valid value of this property binning
visibilityInfo Defines the threshold for toggling between when a layer should be drawn using the feature reduction configuration versus the layer's drawing info.

Bins colored by count Example

{
  "type": "binning",
  "binType": "geohash",
  "fixedBinLevel": 6,
  "drawingInfo": {
    "labelingInfo": [
      {
        "deconflictionStrategy": "none",
        "labelExpressionInfo": {
          "expression": "Text($feature.aggregateCount, '#,###')"
        },
        "maxScale": 0,
        "minScale": 144448,
        "repeatLabel": true,
        "symbol": {
          "type": "esriTS",
          "color": [
            255,
            255,
            255,
            255
          ],
          "font": {
            "family": "Noto Sans",
            "size": 10,
            "weight": "bold"
          },
          "horizontalAlignment": "center",
          "kerning": true,
          "haloColor": [
            153,
            31,
            23,
            255
          ],
          "haloSize": 0.5,
          "rotated": false,
          "text": "",
          "verticalAlignment": "baseline",
          "xoffset": 0,
          "yoffset": 0,
          "angle": 0
        }
      }
    ],
    "renderer": {
      "type": "simple",
      "visualVariables": [
        {
          "type": "colorInfo",
          "field": "aggregateCount",
          "legendOptions": {
            "title": "Number of crashes"
          },
          "stops": [
            {
              "color": [
                215,
                225,
                238,
                255
              ],
              "value": 0
            },
            {
              "color": [
                203,
                214,
                228,
                255
              ],
              "value": 25
            },
            {
              "color": [
                179,
                191,
                209,
                255
              ],
              "value": 75
            },
            {
              "color": [
                200,
                101,
                88,
                255
              ],
              "value": 200
            },
            {
              "color": [
                153,
                31,
                23,
                255
              ],
              "value": 300
            }
          ]
        }
      ],
      "symbol": {
        "type": "esriSFS",
        "color": [
          0,
          255,
          71,
          255
        ],
        "outline": {
          "type": "esriSLS",
          "color": [
            153,
            31,
            23,
            77
          ],
          "width": 0.3,
          "style": "esriSLSSolid"
        },
        "style": "esriSFSSolid"
      }
    }
  },
  "showLabels": true,
  "disablePopup": false,
  "popupInfo": {
    "description": "{aggregateCount} car crashes occurred in this area.",
    "title": "Car crashes"
  },
  "visibilityInfo": {
    "maxScale": 24000,
    "type": "scale"
  }
}

Binning with aggregate fields Example

{
  "type": "binning",
  "binType": "geohash",
  "fixedBinLevel": 6,
  "drawingInfo": {
    "labelingInfo": [
      {
        "deconflictionStrategy": "none",
        "labelExpressionInfo": {
          "expression": "Text($feature.AVG_MOTORIST_INJURED, '#%')"
        },
        "maxScale": 0,
        "minScale": 36112,
        "repeatLabel": true,
        "symbol": {
          "type": "esriTS",
          "color": [
            255,
            255,
            255,
            255
          ],
          "font": {
            "family": "Noto Sans",
            "size": 12,
            "weight": "bold"
          },
          "horizontalAlignment": "center",
          "kerning": true,
          "haloColor": [
            153,
            31,
            23,
            255
          ],
          "haloSize": 0.5,
          "rotated": false,
          "text": "",
          "verticalAlignment": "baseline",
          "xoffset": 0,
          "yoffset": 0,
          "angle": 0
        }
      }
    ],
    "renderer": {
      "type": "simple",
      "visualVariables": [
        {
          "type": "sizeInfo",
          "field": "aggregateCount",
          "legendOptions": {
            "title": "Total crashes"
          },
          "maxDataValue": 300,
          "maxSize": {
            "type": "sizeInfo",
            "valueExpression": "$view.scale",
            "stops": [
              {
                "size": 48,
                "value": 18055
              },
              {
                "size": 32,
                "value": 36111
              },
              {
                "size": 24,
                "value": 72223
              },
              {
                "size": 18,
                "value": 144447
              },
              {
                "size": 12,
                "value": 288895
              },
              {
                "size": 6,
                "value": 577790
              }
            ]
          },
          "minDataValue": 10,
          "minSize": {
            "type": "sizeInfo",
            "valueExpression": "$view.scale",
            "stops": [
              {
                "size": 18,
                "value": 18055
              },
              {
                "size": 12,
                "value": 36111
              },
              {
                "size": 8,
                "value": 72223
              },
              {
                "size": 4,
                "value": 144447
              },
              {
                "size": 2,
                "value": 288895
              },
              {
                "size": 1,
                "value": 577790
              }
            ]
          }
        },
        {
          "type": "colorInfo",
          "field": "AVG_MOTORIST_INJURED",
          "legendOptions": {
            "title": "% of motorists injured per crash"
          },
          "stops": [
            {
              "color": [
                215,
                225,
                238,
                255
              ],
              "label": "No injuries",
              "value": 0
            },
            {
              "color": [
                203,
                214,
                228,
                255
              ],
              "value": 0.1
            },
            {
              "color": [
                179,
                191,
                209,
                255
              ],
              "label": "30%",
              "value": 0.3
            },
            {
              "color": [
                200,
                101,
                88,
                255
              ],
              "value": 0.5
            },
            {
              "color": [
                153,
                31,
                23,
                255
              ],
              "label": ">75%",
              "value": 0.75
            }
          ]
        }
      ],
      "symbol": {
        "type": "esriSMS",
        "color": [
          0,
          255,
          71,
          255
        ],
        "angle": 0,
        "xoffset": 0,
        "yoffset": 0,
        "size": 12,
        "style": "esriSMSCircle",
        "outline": {
          "type": "esriSLS",
          "color": [
            153,
            31,
            23,
            77
          ],
          "width": 0.3,
          "style": "esriSLSSolid"
        }
      }
    }
  },
  "showLabels": true,
  "disablePopup": false,
  "popupInfo": {
    "popupElements": [
      {
        "type": "text",
        "text": "{aggregateCount} car crashes occurred in this area."
      },
      {
        "type": "fields",
        "fieldInfos": [
          {
            "fieldName": "aggregateCount",
            "format": {
              "digitSeparator": true,
              "places": 0
            },
            "label": "Total crashes",
            "visible": true
          },
          {
            "fieldName": "SUM_PERSONS_INJURED",
            "format": {
              "digitSeparator": true,
              "places": 0
            },
            "label": "Total injured",
            "visible": true
          },
          {
            "fieldName": "SUM_PEDESTRIANS_INJURED",
            "label": "Pedestrians injured",
            "visible": true
          },
          {
            "fieldName": "SUM_CYCLIST_INJURED",
            "label": "Cyclists injured",
            "visible": true
          },
          {
            "fieldName": "SUM_MOTORIST_INJURED",
            "label": "Motorists injured",
            "visible": true
          },
          {
            "fieldName": "SUM_KILLED",
            "label": "Total killed",
            "visible": true
          }
        ]
      }
    ],
    "description": "{aggregateCount} car crashes occurred in this area.",
    "title": "Crash summary"
  },
  "fields": [
    {
      "name": "SUM_PERSONS_INJURED",
      "alias": "Total injured",
      "statisticType": "sum",
      "onStatisticField": "NUMBER_OF_PERSONS_INJURED"
    },
    {
      "name": "SUM_PEDESTRIANS_INJURED",
      "alias": "Total pedestrians injured",
      "statisticType": "sum",
      "onStatisticField": "NUMBER_OF_PEDESTRIANS_INJURED"
    },
    {
      "name": "SUM_CYCLIST_INJURED",
      "alias": "Total cyclists injured",
      "statisticType": "sum",
      "onStatisticField": "NUMBER_OF_CYCLIST_INJURED"
    },
    {
      "name": "SUM_MOTORIST_INJURED",
      "alias": "Total motorists injured",
      "statisticType": "sum",
      "onStatisticField": "NUMBER_OF_MOTORIST_INJURED"
    },
    {
      "name": "AVG_MOTORIST_INJURED",
      "alias": "Average motorists injured",
      "statisticType": "avg",
      "onStatisticField": "NUMBER_OF_MOTORIST_INJURED"
    },
    {
      "name": "SUM_KILLED",
      "alias": "Total killed",
      "statisticType": "sum",
      "onStatisticField": "NUMBER_OF_PERSONS_KILLED"
    }
  ]
}

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.