使用LightningChart.NET，您可以為各種用例創(chuàng)建不同類型的圖表。以前的教程已經(jīng)演示了如何創(chuàng)建具有多個(gè)線系列和軸、面積序列和條形系列的簡(jiǎn)單 2D 圖表。在本教程中，我們將展示如何使用 IntensityGridSeries 創(chuàng)建簡(jiǎn)單的 2D 熱圖。

LightningChart® .NET| 下載試用

熱圖是一個(gè)矩陣，其中包含以顏色形式顯示的各個(gè)值。在數(shù)據(jù)可視化中，熱圖可用于通過顏色的變化來提供有關(guān)數(shù)據(jù)值的視覺內(nèi)容和反饋。對(duì)于本教程，我們建議您創(chuàng)建新的 WinForms 或 WPF 應(yīng)用程序。LightningChart提供了兩種創(chuàng)建熱圖的方法 - IntensityGridSeries和TensityMeshSeries。IntensityGrid是X和Y空間中均勻間隔的矩形系列，允許M x N節(jié)點(diǎn)數(shù)組的可視化。IntensityMesh類似于ProtensionyGrid，但在TensionyMesh中，系列不需要是矩形的，而系列節(jié)點(diǎn)可以在X和Y空間中任意定位。在本教程中，我們使用的是 IntensityGridSeries。

1. 創(chuàng)建一個(gè)熱圖實(shí)例作為強(qiáng)度網(wǎng)格系列。

   // Create a Heat Map as IntensityGridSeries.
   var heatMap = new IntensityGridSeries(_chart.ViewXY, axisX, axisY);

為了以所需的顏色顯示數(shù)據(jù)值，我們需要?jiǎng)?chuàng)建一個(gè) ValueRangePalette。ValueRangePalette 用于根據(jù)值定義數(shù)據(jù)著色的顏色。

2. 為 IntensityGridSeries 創(chuàng)建一個(gè) ValueRangePalette。

   // Creating palette for IntensityGridSeries.
   var palette = new ValueRangePalette(series);

圖表控件LightningChart具有ValueRangePalette的預(yù)設(shè)值。為了以所需的方式為數(shù)據(jù)著色，我們首先需要清除ValueRangePalette及其調(diào)色板步驟。

3. 清除 ValueRangePalette 中的預(yù)設(shè)值。

   // 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();

然后，我們需要使用調(diào)色板類型為調(diào)色板設(shè)置顏色。您可以使用 System.Windows.Media.Color 或 System.Drawing.Color 定義顏色，具體取決于您使用的是 WPF 還是 WinForms。PaletteType 定義調(diào)色板著色在應(yīng)用程序中的外觀。



對(duì)于此示例，我們將“調(diào)色板類型”設(shè)置為“漸變”。

4. 定義用于為數(shù)據(jù)著色的調(diào)色板步驟。

   // 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;

   您可以使用強(qiáng)度點(diǎn)將數(shù)據(jù)添加到熱點(diǎn)圖。強(qiáng)度點(diǎn)是強(qiáng)度系列的數(shù)據(jù)點(diǎn)。在此示例中，我們使用值作為 IntensityPoints 填充 IntensityGrid，這些值用 ValueRangePalette 著色。

5. 生成熱圖數(shù)據(jù)。

   // 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(); }

通過本文，您可以快速了解到如何建立2D 熱點(diǎn)圖圖表，想要了解更多相關(guān)教程，歡迎進(jìn)入慧都官網(wǎng)查看。

歡迎加入LightningChart技術(shù)交流群，獲取最新產(chǎn)品咨詢：740060302

想要了解或購買LightningChart 正版授權(quán)的朋友，歡迎咨詢。