HeatmapPoint.Value Property
Gets or sets the heatmap point value.
Namespace: DevExpress.Xpf.Map
Assembly: DevExpress.Xpf.Map.v24.2.dll
NuGet Package: DevExpress.Wpf.Map
#Declaration
#Property Value
Type | Description |
---|---|
Double | The heatmap point value. |
#Remarks
Points with higher values have more saturated colors.
The Map Control uses the following algorithm to color heatmap points. If the Value property is not specified, it is set to 0.4. Pixel weight (value) is calculated for all pixels inside the point radius. The Map Control uses the following formula:
where:
- dx/dy - the distance from the heatmap point center in pixels along the X and Y axes, respectively;
- PointRadius - the HeatmapDensityBasedAlgorithm.PointRadius property value;
- Value - HeatmapPoint.Value (the heatmap point value).
For example, the point radius is 10. The heatmap point’s central pixel has a weight that equals the point value. The weight of the pixel located next to the central pixel (dx = 1, dy = 0) is 0.9*Value, the second pixel from the center (dx = 2, dy = 0) is 0.8*Value, etc.
Central Pixel Point Pixel Value = 2 |
Third pixel from the center Point Pixel Value = (1 - 3/10)*2= 1. |
---|---|
![]() |
![]() |
The Map Control summarizes values from different heatmap points for each pixel. Since the point radius is set in pixels, the Map Control reaggregates heatmap points when you zoom in to or zoom out of a map. For this reason, areas with aggregated points can change colors.
In the right image, heatmap points are closer to each other. Pixels between them are included in the point radiuses of two heatmap points. The Map Control calculates values for these pixels and colors them according to these values.
Zoom Level = 5 | Zoom Level = 4 |
---|---|
![]() |
![]() |
The Map Control uses the Colorizer to color pixels based on their values. The colorizer gets colors from the Colors collection to paint pixels with values from the RangeStops collection. Pixels with values between range stops are colored with mixed colors. If you do not specify the colorizer, the Map Control uses the following colorizer code:
ColorCollection colors = new ColorCollection {
Color.FromArgb(10, 0, 128, 0),
Color.FromArgb(200, 25, 153, 0),
Colors.Yellow,
Colors.Red
};
ChoroplethColorizer colorizer = new ChoroplethColorizer {
ApproximateColors = true,
Colors = colors,
RangeStops = new DoubleCollection(new double[] { 0, 0.1, 0.5, 1 })
};
Note
When you do not define Colorizer and set the same value for all points (or do not specify point values), the Map Control sets points values to 0.
When the default colorizer is used, the Map Control displays the legend with a scale from 0 to 1.
#Example
This example shows how to use a HeatmapPointStorage object to create a heatmap layer.
- Create an ImageLayer object and add it to the MapControl.Layers collection.
- Assign a HeatmapProvider object to the ImageLayer.DataProvider property.
- Use a HeatmapPointStorage object to initialize the PointSource property.
Markup:
<dxm:MapControl>
<dxm:ImageLayer>
<dxm:HeatmapProvider>
<dxm:HeatmapProvider.PointSource>
<dxm:HeatmapPointStorage x:Name="storage"/>
</dxm:HeatmapProvider.PointSource>
<dxm:HeatmapProvider.Algorithm>
<dxm:HeatmapDensityBasedAlgorithm PointRadius="50"/>
</dxm:HeatmapProvider.Algorithm>
<dxm:HeatmapProvider.Colorizer>
<dxm:ChoroplethColorizer RangeStops="0.1, 0.2, 0.7, 1.0"
ApproximateColors="True">
<dxm:ChoroplethColorizer.Colors>
<Color A="50" R="128" G="255" B="0"/>
<Color A="255" R="255" G="255" B="0"/>
<Color A="255" R="234" G="72" B="58"/>
<Color A="255" R="162" G="36" B="25"/>
</dxm:ChoroplethColorizer.Colors>
</dxm:ChoroplethColorizer>
</dxm:HeatmapProvider.Colorizer>
</dxm:HeatmapProvider>
</dxm:ImageLayer>
</dxm:MapControl>
Code-Behind:
using System.Windows;
using DevExpress.Xpf.Map;
namespace HeatmapPointStorage {
public partial class MainWindow : Window {
public MainWindow() {
InitializeComponent();
storage.Points.Add(new HeatmapPoint(new GeoPoint(23.5309, -0.4211), 1));
storage.Points.Add(new HeatmapPoint(new GeoPoint(32.3248, 21.0537), 0.5));
storage.Points.Add(new HeatmapPoint(new GeoPoint(14.1503, 16.3626), 1));
storage.Points.Add(new HeatmapPoint(new GeoPoint(7.2144, 34.2711), 1));
storage.Points.Add(new HeatmapPoint(new GeoPoint(-4.5456, 10.1143), 0.5));
}
}
}
You can also create heatmap points in XAML:
<dxm:HeatmapProvider.PointSource>
<dxm:HeatmapPointStorage>
<dxm:HeatmapPointStorage.Points>
<dxm:HeatmapPoint Value="0.5">
<dxm:HeatmapPoint.Location>
<dxm:GeoPoint Latitude="32.3248" Longitude="21.0537"/>
</dxm:HeatmapPoint.Location>
</dxm:HeatmapPoint>
<!-- Other heatmap points. -->
</dxm:HeatmapPointStorage.Points>
</dxm:HeatmapPointStorage>
</dxm:HeatmapProvider.PointSource>