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:
|
| 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"
}
]
}