彩票走势图

LightningChart .NET使用教程(八):二维热图图表

翻译|使用教程|编辑:凌霄汉|2022-03-08 17:21:15.010|阅读 280 次

概述:本文主要介绍如何使用LightningChart创建二维热图图表。

# 慧都年终大促·界面/图表报表/文档/IDE等千款热门软控件火热促销中 >>

相关链接:

Arction Ltd从事高性能的大数据可视化研发近15年,其下产品LightningChart处于行业绝对领先水平,本使用教程将会带您学会如何使用LightningChart .NET进行数据可视化展示。


使用LightningChart,您可以为各种用例创建不同类型的图表。以前的教程演示了如何创建具有多个线系列和轴、区域系列和条形系列的简单 2D 图表。
在本教程中,我们将展示如何使用IntensityGridSeries创建简单的 2D 热图。

LightningChart .NET使用教程(八):二维热图图表

热图是一个矩阵,包含以颜色表示的各个值。在数据可视化中,热图可用于通过颜色变化提供可视化内容和有关数据值的反馈。对于本教程,我们建议您创建一个新的 WinForms 或 WPF 应用程序。LightningChart提供了两种创建热图的方法 - IntensityGridSeries和IntensityMeshSeries。IntensityGrid是 X 和 Y 空间中均匀分布的矩形系列,允许可视化 M x N 节点阵列。IntensityMesh与IntensityGrid类似,但在IntensityMesh, 系列不需要是矩形的,而系列节点可以在 X 和 Y 空间中任意定位。对于本教程,我们使用IntensityGridSeries。

1. 创建一个热图实例作为 IntensityGridSeries。
// Create a Heat Map as IntensityGridSeries.
var heatMap = new IntensityGridSeries(_chart.ViewXY, axisX, axisY);

为了以所需的颜色显示数据值,我们需要创建一个ValueRangePalette。ValueRangePalette用于根据值定义数据着色的颜色。

2. 为 IntensityGridSeries 创建一个 ValueRangePalette。
// Creating palette for IntensityGridSeries.
var palette = new ValueRangePalette(series);

LightningChart具有ValueRangePalette的预设值。为了以所需的方式为数据着色,我们首先需要清除ValueRangePalette及其调色板步骤。

3. 从 ValueRangePalette 中清除预设值。
// LightningChart has some preset values for palette steps.
// Clear the preset values from palette before setting new ones.
foreach (var step in palette.Steps)
{
    step.Dispose();
}
palette.Steps.Clear();

然后我们需要与PaletteType一起为我们的调色板设置颜色。您可以使用System.Windows.Media.Color或System.Drawing.Color定义颜色,具体取决于您使用的是 WPF 还是 WinForms。PaletteType定义调色板颜色在您的应用程序中的外观。

LightningChart .NET使用教程(八):二维热图图表

对于此示例,我们将PaletteType设置为Gradient。

4. 定义用于为数据着色的调色板步骤。

将 CSV 文件中的数据加载到系列数据点中。数据必须按以下顺序按列组织:

 // Add steps into palette. 
// Palette is used for presenting data in Heat Map with different colors based on their value.
palette.Steps.Add(new PaletteStep(palette, Color.FromRgb(0, 0, 255), -25));
palette.Steps.Add(new PaletteStep(palette, Color.FromRgb(20, 150, 255), 0));
palette.Steps.Add(new PaletteStep(palette, Color.FromRgb(0, 255, 0), 25));
palette.Steps.Add(new PaletteStep(palette, Color.FromRgb(255, 255, 20), 50));
palette.Steps.Add(new PaletteStep(palette, Color.FromRgb(255, 150, 20), 75));
palette.Steps.Add(new PaletteStep(palette, Color.FromRgb(255, 0, 0), 100));
palette.Type = PaletteType.Gradient;
palette.MinValue = -50;

您可以使用IntensityPoints将数据添加到热图。IntensityPoints是强度系列的数据点。在这个例子中,我们用值作为IntensityPoints填充我们的 IntensityGrid,这些值用ValueRangePalette着色。

5. 为热图生成数据。
// Generate data.
public void GenerateData(int columns, int rows)
{
    // Create new IntensityPoint series for data.
    var data = new IntensityPoint[_columns, _rows];

    // Disable rendering before updating chart properties to improve performance
    // and to prevent unnecessary chart redrawing while changing multiple properties.
    _chart.BeginUpdate();

    // Set data values and add them to Heat Map.
    for (int i = 0; i < _columns; i++) { for (int j = 0; j < _rows; j++) { // Add values to the IntensityPoint series, points are generated by using following function. data[i, j].Value = 30.0 + 20 * Math.Cos(20 + 0.0001 * (double)(i * j)) + 70.0 * Math.Cos((double)(j - i) * 0.01); } } // Add generated data as Heat Map data. _heatMap.Data = data; // Call EndUpdate to enable rendering again. _chart.EndUpdate(); }

点击进入下一章:LightningChart .NET使用教程(九):带有鼠标点跟踪和注释的 3D 图表


如果您对该图表控件感兴趣,欢迎加入图表控件QQ交流群:740060302

如果你想了解LightningChart.NET正版价格,欢迎查看产品介绍


标签:

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@pclwef.cn


为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
扫码咨询


添加微信 立即咨询

电话咨询

客服热线
023-68661681

TOP