Heatmap Renderer

The HeatmapRenderer renders point data into a raster visualization that emphasizes areas of higher density or weighted values.

Referenced by: renderer

Properties

Property Details
authoringInfo An object containing metadata about the authoring process for creating a renderer object. This allows the authoring clients to save specific settings so that next time it is accessed via the UI, their selections are remembered. Non-authoring clients can ignore it.
blurRadius The radius (in pixels) of the circle over which the majority of each point's value is spread. Only used for heatmaps calculated with Gaussian blur. This value must be set in conjunction with maxPixelIntensity and minPixelIntensity and will eventually be deprecated. New heatmaps should favor radius over blurRadius, but must continue to persist this value for backward compatibility with old clients.
colorStops[] An array of colorStop objects describing the renderer's color ramp with more specificity than just colors.
field This is optional as this renderer can be created if no field is specified. Each feature gets the same value/importance/weight or with a field where each feature is weighted by the field's value.
legendOptions Options for describing the heatmap in the legend.
See legendOptions properties table.
maxDensity The density value assigned to the final color in the colorStops. Only used for heatmaps calculated with kernel density. This value must be set in conjunction with radius and minDensity.
maxPixelIntensity The pixel intensity value assigned to the final color in the color ramp. Only used for heatmaps calculated with Gaussian blur. This value must be set in conjunction with blurRadius and minPixelIntensity and will eventually be deprecated. New heatmaps should favor maxDensity over maxPixelIntensity, but must continue to persist this value for backward compatibility with old clients.
minDensity The density value assigned to the first color in the colorStops. Only used for heatmaps calculated with kernel density. This value must be set in conjunction with radius and maxDensity.
minPixelIntensity The pixel intensity value assigned to the initial color in the color ramp. Only used for heatmaps calculated with Gaussian blur. This value must be set in conjunction with maxPixelIntensity and blurRadius and will eventually be deprecated. New heatmaps should favor minDensity over minPixelIntensity, but must continue to persist this value for backward compatibility with old clients.
radius The radius (in points) of the circle representing each point. Only used for heatmaps calculated with kernel density. This value must be set in conjunction with minDensity and maxDensity.
referenceScale When defined, the heatmap will maintain a consistent, fixed rendering across all scales according to its configuration at the scale defined here. The heatmap will not dynamically update as the user zooms in and out. For example, when a referenceScale is defined, the same geographic areas appearing hot/dense will always appear hot/dense as the user zooms in and out.
type Specifies the type of renderer used.
Valid value of this property heatmap

legendOptions properties

Property Details
maxLabel Text in the legend that describes the hottest (most dense) part of the heatmap. Only applicable to Heatmap renderers. If not specified, then a localized label, for 'High' will display on the legend.
minLabel Text in the legend that describes the coldest (least dense) part of the heatmap. Only applicable to Heatmap renderers. If not specified, then a localized label, for 'Low' will display on the legend.
title The title of the legend.

Example

Live sample web map showing heatmap renderer.

{
  "type": "heatmap",
  "blurRadius": 10,
  "legendOptions": {
    "minLabel": "Sparse",
    "maxLabel": "Dense"
  },
  "colorStops": [
    {
      "ratio": 0,
      "color": [
        133,
        193,
        200,
        0
      ]
    },
    {
      "ratio": 0.01,
      "color": [
        133,
        193,
        200,
        0
      ]
    }
  ],
  "maxPixelIntensity": 1249.2897582229123,
  "minPixelIntensity": 0
}

Example

Heatmap renderer calculated with kernel density.

{
  "type": "heatmap",
  "radius": 10,
  "blurRadius": 3,
  "field": "mag",
  "colorStops": [
    {
      "color": [
        63,
        40,
        102,
        0
      ],
      "ratio": 0
    },
    {
      "color": [
        71,
        43,
        119,
        77
      ],
      "ratio": 0.083
    },
    {
      "color": [
        224,
        207,
        64,
        77
      ],
      "ratio": 0.913
    },
    {
      "color": [
        255,
        255,
        0,
        77
      ],
      "ratio": 1
    }
  ],
  "maxDensity": 550,
  "maxPixelIntensity": 25,
  "minDensity": 0,
  "minPixelIntensity": 0,
  "referenceScale": 5444000
}

Example

Heatmap with fade ratio applied to color stops.

{
  "type": "heatmap",
  "authoringInfo": {
    "fadeRatio": 0.7
  },
  "colorStops": [
    {
      "color": [
        133,
        193,
        200,
        0
      ],
      "ratio": 0
    },
    {
      "color": [
        133,
        193,
        200,
        0
      ],
      "ratio": 0.01
    },
    {
      "color": [
        133,
        193,
        200,
        0
      ],
      "ratio": 0.01
    },
    {
      "color": [
        133,
        193,
        200,
        3
      ],
      "ratio": 0.01
    },
    {
      "color": [
        144,
        161,
        190,
        22
      ],
      "ratio": 0.0925
    },
    {
      "color": [
        156,
        129,
        132,
        44
      ],
      "ratio": 0.17500000000000002
    },
    {
      "color": [
        167,
        97,
        170,
        66
      ],
      "ratio": 0.2575
    },
    {
      "color": [
        175,
        73,
        128,
        88
      ],
      "ratio": 0.34
    },
    {
      "color": [
        184,
        48,
        85,
        110
      ],
      "ratio": 0.42250000000000004
    },
    {
      "color": [
        192,
        24,
        42,
        132
      ],
      "ratio": 0.505
    },
    {
      "color": [
        200,
        0,
        0,
        149
      ],
      "ratio": 0.5875
    },
    {
      "color": [
        211,
        51,
        0,
        170
      ],
      "ratio": 0.67
    },
    {
      "color": [
        222,
        102,
        0,
        191
      ],
      "ratio": 0.7525000000000001
    },
    {
      "color": [
        233,
        153,
        0,
        211
      ],
      "ratio": 0.8350000000000001
    },
    {
      "color": [
        244,
        204,
        0,
        232
      ],
      "ratio": 0.9175000000000001
    },
    {
      "color": [
        255,
        255,
        0,
        255
      ],
      "ratio": 1
    }
  ],
  "maxDensity": 550,
  "maxPixelIntensity": 25,
  "minDensity": 0,
  "minPixelIntensity": 0,
  "radius": 10,
  "blurRadius": 3
}

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