下載Mindfusion最新版本

Thia post將演示如何創建具有負值的水平堆疊條形圖。我們將使用Charting for WinForms組件，最終圖表如下所示：

使用圖表控件的WinForms中的負疊加條形圖

一、數據

該圖表將使用四個系列。前兩個系列是你清楚看到的 - 紅色和藍色系列。我們用表示數據的隨機值初始化兩個數據數組：

var firstBarX = new List<double>(11);
var secondBarX = new List<double>(11);

Random r = new Random();
            
for(int i = 0; i < 11; i++)
   {
       firstBarX.Add(2.2 + r.NextDouble());
       secondBarX.Add(2.4 + r.NextDouble());
    }

我們需要一個列表，其數據值與第一個系列完全相同，但是為負數。它們將提供一個透明的初始系列，其條形將偏移第一個紅色系列，與紅色條的值應該是：

//generate data for the transparent series
var transparentBarX = new List<double>(firstBarX.Count);

for (var i = 0; i < firstBarX.Count; i++)			
    transparentBarX.Add(0 - firstBarX[i]);

Y軸的數據非常簡單。我們只需要一個包含1到12之間數字的列表：

//data for the Y-axis
var barY = new List<double>();
for (int i = 1; i < 12; i++)			
	barY.Add(i);

二、標簽

我們將創建兩個列表，其中包含我們將顯示的標簽 - 兩個軸。Y軸的標簽也將用作工具提示。我們只是初始化兩個字符串列表：

//initialize labels for the X axis
var ageLabels = new List<string>() { "0-5", "6-11", "12-17", "18-23", "24-29", "30-35",
		   "36-41", "42-47", "48-53", "54-59", "60-65" };

//initialize labels for the Y axis.
var percentageLabels = new List<string> { "5%", "4%", "3%", "2%", "1%", "0%", 				"1%", "2%", "3%", "4%", "5%", };

在創建系列時，我們將在下一節中使用此標簽列表。

三、系列

我們將使用Series2D類型的4個系列。此系列對其SupportedLabels屬性很有用- 它允許我們指定系列的標簽將用于什么。我們從透明系列開始。其標簽將用于Y軸的自定義標簽：

var seriesTransparent = new MindFusion.Charting.Series2D(transparentBarX, barY, ageLabels);
seriesTransparent.SupportedLabels = MindFusion.Charting.LabelKinds.YAxisLabel;
seriesTransparent.Title = "";

我們使用前一段中記住的負值來獲取X數據。年齡標簽是為軸提供數據的標簽。 然后我們初始化圖表數據的兩個系列：

var seriesFirst = new MindFusion.Charting.Series2D(firstBarX, barY, ageLabels);
seriesFirst.SupportedLabels = MindFusion.Charting.LabelKinds.ToolTip;
seriesFirst.Title = "Female";

var seriesSecond = new MindFusion.Charting.Series2D(secondBarX, barY, ageLabels);
seriesSecond.SupportedLabels = MindFusion.Charting.LabelKinds.ToolTip;
seriesSecond.Title = "Male";

我們創建的最后一個系列只是為X軸提供數據，我們將其SupportedLabels屬性設置為MindFusion.Charting.LabelKinds.XAxisLabel。此系列的X數據對應于X標簽的坐標，這就是為什么將數字從-5設置為5作為X數據的原因：

var firstParamList = new List<double>();
      for (int i = -5; i < 6; i++)			
	 firstParamList.Add(i);

Y數據可以全為零，無論如何我們都不會使用它們。

var secondParamList = new List<double>();
    for (int i = 0; i < 12; i++)			
	secondParamList.Add(0);

我們以這種方式創建系列：

//the purpose of this series is to only supply the Xaxis labels, it is transparent.	
var seriesThird = new MindFusion.Charting.Series2D(firstParamList, secondParamList, percentageLabels);           	
seriesThird.SupportedLabels = MindFusion.Charting.LabelKinds.XAxisLabel;
seriesThird.Title = "";

創建完所有系列后，應將它們添加到BarChart的Series集合中：

barChart.Series = new ObservableCollection<Series>
	{ seriesTransparent, seriesFirst, seriesSecond, seriesThird };

四、軸和網格

如果我們想要顯示網格并且網格與軸整齊對齊，我們需要修復X軸的劃分。我們將最小值設置為-6，間隔1和最大值設置為6：

barChart.XAxis.Interval = 1;
barChart.XAxis.MinValue = -6;
barChart.XAxis.MaxValue = 6;	

我們將使用另外三個屬性來隱藏兩個軸上的間隔標簽，在它們上顯示刻度并為每個軸設置標題：

barChart.XAxis.Title = "Percentage of the Population";
barChart.YAxis.Title = "Ages";
			
barChart.ShowYCoordinates = false;
barChart.ShowXCoordinates = false;

barChart.ShowXTicks = true;
barChart.ShowYTicks = true;

最后，我們必須設置網格并指定條形是水平的：

barChart.GridType = GridType.Vertical;
barChart.HorizontalBars = true;

五、Styles

通過Plot 的SeriesSyle屬性完成圖表的樣式設置。您可以為其分配不同的系列類型，您可以在文檔中的ISeriesStyle界面頁面上查看列表：

barChart.Plot.SeriesStyle = new PerSeriesStyle()
{
	Strokes = new List<MindFusion.Drawing.Brush> {
		firstBrush, new SolidBrush(Color.FromArgb(179, 0, 0)), 
                new SolidBrush(Color.FromArgb(0, 0, 102)), firstBrush
		},
		StrokeThicknesses = new List<double> {
			 0,2,2,0
		},
		Fills = new List<MindFusion.Drawing.Brush>()
		{
			firstBrush, secondBrush, thirdBrush, firstBrush
	}
};

此樣式表示其集合中的每個畫筆將用于圖表中的一個系列。我們為它分配了4個畫筆和4個筆畫。第一個刷子是透明的，第二個是紅色的，另一個是藍色的，最后一個是黑色的 - 無論如何我們都不會用它畫畫。

圖表的Theme屬性包含許多用于自定義外觀的選項。以下是其中一些：

barChart.Theme.LegendBorderStrokeThickness = 1;
barChart.Theme.LegendBorderStroke = new SolidBrush(Color.Black);
barChart.Theme.GridColor2 = Color.White;
barChart.Theme.GridColor1 = Color.FromArgb(250, 250, 250);
barChart.Theme.GridLineColor = Color.FromArgb(153, 153, 153);
barChart.Theme.PlotBackground = new SolidBrush(Color.FloralWhite);
...........
..........

下載下載CS樣本中的負堆棧條形圖

關于WinFms的MindFusion圖表：一個多功能儀表板組件，為您的WinForms應用程序提供創建迷人圖表，交互式儀表板和實用儀表的能力。該組件結合了靈活的API，允許自定義組合圖表組件，以構建您想要的任何類型的圖表。您可以添加任意類型的軸，將各種圖表系列組合到一個圖表中，每個圖表都有不同的數據提供者。該控件還支持平移和縮放，滾動，無限數量的圖例，網格和儀表板面板。線性和橢圓形儀表完善了工具組并保證了構建完美儀表所需的每個功能，WinForms中任何類型或儀表板的圖表都在您的指尖。

購買Mindfusion正版授權，請點擊“”喲！