The XtraCharts suite provides a wide variety of different 2D chart types (also calledview types) which give you the ability to display data as any of the basic chart types, or even as a combination of different series views. In addition, if the data provided for a particular chart type is still valid for another chart type, you can change the current series view with a single click or line of code (see How to: Change the View of a Series). This makes the Chart Control more flexible and effective in representing data.

The topics listed in this section describe the 2D chart types available in XtraCharts, along with short descriptions on how to use them. The following 2D chart types are available:

Moreover, XtraCharts introduces a special chart type that uses an optimized algorithm for quick series rendering, to afford representation of avery large quantity of points:


Swift Plot

Also note that with XtraCharts, it's possible to combine several 2D charts together into a single composite chart. Refer to theCombining Different Series Views document, for more information on composite charts.

而且,XtraCharts引入了一个特殊的图表类型,使用优化算法处理快速序列渲染,来满足大量点的一个显示:这就是Swift Plot(迅捷快速绘制)。

请注意:使用XtraCharts,可以在单一的组合图表中一起联合使用几种2D图表。欲了解更多组合图的信息,请参考Combining Different Series Views文档。

Area Chart
  1. 面积图

Short Description
 
 

The Area Chart is represented by the AreaSeriesView object, which belongs to Area Series Views. This view displays series as filled areas on a diagram, with each data point displayed as a peak or hollow in the area. This view is useful when you need to show trends for several series on the same diagram, and also show the relationship of the parts to the whole.

面积图由AreaSeriesView对象表示,属于Area Series Views区域序列视图集.这种视图通过填充图中区域显示序列,每一个数据点被显示为区域中的一个峰值或空心。当你需要在同一个图表中展示几种序列趋势,并且显示部分和整体之间的关系时,区域图表将非常合适。

An Area chart is shown in the image below. Note that this chart type is based upon theXYDiagram, so it can be rotated to show bars either vertically or horizontally.

这幅图表的基类型是XYDiagram,所以可以被旋转显示为横型或竖型条形图。

Chart Type Characteristics 图表类型特性
 
 

The table below lists the main characteristics of this chart type.

最主要特性

Feature

Value

Series View type序列视图类型 AreaSeriesView
Diagram type图类型 2D-XYDiagram
Number of arguments per series point每一个序列点的参数个数 1
Number of values per series point每一个序列点的值个数 1
Note

For information on which chart types can be combined with the Area Chart, refer to theCombining Different Series Views document.

Example
 
 

The following example demonstrates how to create a ChartControl with two series of the AreaSeriesView type, and add this chart to a form at runtime. Before proceeding with this example, first create a Windows Forms Application in Visual Studio, and include allnecessary assemblies to the References list of your project.

Then, add the following code to the Form.Load event handler.

AreaSeriesView类型创建ChartControl,并添加图表到运行时窗体。在处理之前,首先新建一窗体应用程序,并包含需要的引用程序集。

然后,添加下列代码到Form.Load事件处理器。

Required Libraries
 
 

Below are the essential libraries required by applications that use the XtraCharts Suite. These libraries are considered redistributable under the XtraCharts EULA and are intended for distribution by you to end-users of software applications that you create.

Assembly

Description

DevExpress.Data.v13.1.dll Implements the most basic functionality common to all DevExpress controls. This includes classes for data binding, skinning, printing, exporting, as well as many other auxiliary types and resources.
DevExpress.Utils.v13.1.dll Contains basic utility classes and common skins (e.g., DevExpress Style, VS2010 and Office 2010*).
DevExpress.Printing.v13.1.Core.dll Contains classes that implement the basic functionality for DevExpress printing libraries.
DevExpress.XtraEditors.v13.1.dll Contains a set of full-featured editors supported by the XtraEditors Suite.
DevExpress.XtraNavBar.v13.1.dll Contains a navigation bar component supported by the XtraNavBar suite.
DevExpress.Charts.v13.1.Core.dll All DevExpress Charting controls contain classes shared via the same charting engine. These classes, along with a codebase, are intended for internal use, but also provide the basic functionality forASP.NET Charts,WinForms Charts, as well as WPF Charts and Silverlight Charts.
DevExpress.XtraCharts.v13.1.dll Contains basic classes that implement the main functionality for the XtraCharts suite.
DevExpress.XtraCharts.v13.1.UI.dll Contains the ChartControl control that is intended for use in Windows applications.
DevExpress.XtraCharts.v13.1.Wizard.dll Contains the ChartWizard and auxiliary classes.
C#   VB  
using DevExpress.XtraCharts;
// ... private void Form1_Load(object sender, EventArgs e) {
// Create a new chart.
ChartControl areaChart = new ChartControl(); // Create two area series.
Series series1 = new Series("Series 1", ViewType.Area);
Series series2 = new Series("Series 2", ViewType.Area); // Add points to them.
series1.Points.Add(new SeriesPoint(1, 15));
series1.Points.Add(new SeriesPoint(2, 18));
series1.Points.Add(new SeriesPoint(3, 25));
series1.Points.Add(new SeriesPoint(4, 33)); series2.Points.Add(new SeriesPoint(1, 10));
series2.Points.Add(new SeriesPoint(2, 12));
series2.Points.Add(new SeriesPoint(3, 14));
series2.Points.Add(new SeriesPoint(4, 17)); // Add both series to the chart.
areaChart.Series.AddRange(new Series[] { series1, series2 }); // Set the numerical argument scale types for the series,
// as it is qualitative, by default.
series1.ArgumentScaleType = ScaleType.Numerical;
series2.ArgumentScaleType = ScaleType.Numerical; // Access the view-type-specific options of the series.
((AreaSeriesView)series1.View).Transparency = 80; // Access the type-specific options of the diagram.
((XYDiagram)areaChart.Diagram).EnableAxisXZooming = true; // Hide the legend (optional).
areaChart.Legend.Visible = false; // Add the chart to the form.
areaChart.Dock = DockStyle.Fill;
this.Controls.Add(areaChart);
}
 
Show Me

The complete sample project is available in the DevExpress Code Central database athttp://www.devexpress.com/example=E146. Depending on the target platform type (ASP.NET, WinForms, etc), you can either run this example online or download an auto-executable sample.

 
See Also
 
 
Bubble Chart

2、气泡图

Short Description
 
 

The Bubble Chart is represented by theBubbleSeriesView object, which belongs to Point Series Views. This view, in addition to other point diagram capabilities, allows you to visually represent data that has a third dimension (it is theBubbleLabelValueToDisplay.Weight of a series point), expressed in a bubble's size. You map two dimensions along the usual X and Y axes, and then the third dimension is displayed as a shape (a filled circle - "bubble", or a star, triangle, etc.) at the data point. Also, you can specify the size of the smallest and largest marker for the chart, by using theBubbleSeriesView.MaxSize andBubbleSeriesView.MinSize properties of the series view.

气泡图由BubbleSeriesView对象表示,属于Point Series Views点序列视图集。这种视图,除了具有其他点状图表的功能外,还可以增加第三维(要显示值的气泡标签权重BubbleLabelValueToDisplay.Weight)通过气泡的大小来可视化的显示数据。只需映射传统的X和Y轴,第三维就会在数据点处显示为一个几何形状(一个填充圆-“气泡”,或者是星形,三角形等等)。你也可以通过设置序列视图的BubbleSeriesView.MaxSize and BubbleSeriesView.MinSize属性指定图表标记的最小和最大尺寸。

An example of the Bubble chart is shown in the image below. Note that this chart type is based upon theXYDiagram, so it can be rotated to change axis positions.

继承自XYDiagram,可以旋转改变轴的位置。

Chart Type Characteristics
图表类型特定
 
 

The table below lists the main characteristics of this chart type.

气泡图主要特定

Feature

Value

Series View type BubbleSeriesView气泡序列视图
Diagram type 2D-XYDiagram
Number of arguments per series point 1每一个点的自变量个数为1
Number of values per series point 2 (Value and Weight)每一个点因变量个数为2(值和权重)
Note

For information on which chart types can be combined with the Bubble Chart, refer to theCombining Different Series Views document.

Example
 
 

The following example demonstrates how to create aChartControl with two series of the BubbleSeriesView type, and add this chart to a form at runtime. Before proceeding with this example, first create a Windows Forms Application in Visual Studio, and include allnecessary assemblies to the References list of your project.

Then, add the following code to theForm.Load event handler.

C#   VB  
using System;
using System.Windows.Forms;
using DevExpress.XtraCharts;
// ... private void Form1_Load(object sender, EventArgs e) {
// Create a new chart.
ChartControl bubbleChart = new ChartControl(); // Create two bubble series.
Series series1 = new Series("Series 1", ViewType.Bubble);
Series series2 = new Series("Series 2", ViewType.Bubble); // Add points to them.
series1.Points.Add(new SeriesPoint(1, 11, 2));
series1.Points.Add(new SeriesPoint(2, 10, 1));
series1.Points.Add(new SeriesPoint(3, 14, 3));
series1.Points.Add(new SeriesPoint(4, 17, 2)); series2.Points.Add(new SeriesPoint(1, 15, 3));
series2.Points.Add(new SeriesPoint(2, 18, 4));
series2.Points.Add(new SeriesPoint(3, 25, 2));
series2.Points.Add(new SeriesPoint(4, 33, 1)); // Add both series to the chart.
bubbleChart.Series.AddRange(new Series[] { series1, series2 }); // Set the numerical argument scale types for the series,
// as it is qualitative, by default.
series1.ArgumentScaleType = ScaleType.Numerical;
series2.ArgumentScaleType = ScaleType.Numerical; // Access the view-type-specific options of the series.
((BubbleSeriesView)series1.View).MaxSize = 2;
((BubbleSeriesView)series1.View).MinSize = 1;
((BubbleSeriesView)series1.View).BubbleMarkerOptions.Kind = MarkerKind.Circle; // Access the type-specific options of the diagram.
((XYDiagram)bubbleChart.Diagram).EnableAxisXZooming = true; // Hide the legend (if necessary).
bubbleChart.Legend.Visible = false; // Add the chart to the form.
bubbleChart.Dock = DockStyle.Fill;
this.Controls.Add(bubbleChart);
}
 
 
Show Me

The complete sample project is available in the DevExpress Code Central database athttp://www.devexpress.com/example=E904. Depending on the target platform type (ASP.NET, WinForms, etc), you can either run this example online or download an auto-executable sample.

Candle Stick Chart

3、烛台图表

Short Description
 
 

The Candle Stick Chart is represented by theCandleStickSeriesView object, which belongs to Financial Series Views (also called Low-High-Open-Close).

烛台图表由CandleStickSeriesView对象表示,属于金融序列视图集(也被称为股票图 –最低-最高--开盘-收盘)

This view is used to show the variation in the price of stock over the course of a day. Each point consists of a rectangle (body the bottom and top values of which correspond to theOpen and Close prices) and a vertical line (shadow,wick ortail the bottom and top values of which correspond to theLow andHigh prices). If the stock closes higher than its opening price, the body is hollow. And if the stock closes lower than its opening price, the body is filled.

这个视图用来表示漫长的一天中股票价格的变化趋势。每一个点由一个矩形(矩形体 底部和顶部的值相当于股票价格中的开盘和收盘)和一条垂直线(影子,灯芯或尾巴 底部和顶部的值相当于股票中的最低最高价)组成。如果股票的收盘价高于开盘价,矩形体就是空心的。如果收盘价低于开盘价,矩形体就是实心的。

For Candle Stick charts, you can choose for which price level (Low, High, Open or Close) to enableFinancialSeriesViewBase.ReductionOptions, meaning that in case the specified price is lower in comparison to the previous point's value, the subsequent point is painted red (or any other color).

对于阴阳烛图,可以选择何种价格级别(低价、高价、开盘、收盘)来启用FinancialSeriesViewBase.ReductionOptions,即在指定的价格低于前面的点的值的情况下,后续点被标记为红色(或其他任何一种颜色)

A Candle Stick chart is shown in the image below. Note that this chart type is based uponXYDiagram, so it can be rotated to show bars either vertically or horizontally.

继承自XYDiagram,所以工具条既可以垂直也可以水平显示。

To learn how to exclude holidays and weekends from an axis scale, refer toDate-Time Data Representation.

如果想学习如何在轴刻度中包含节日和周末,参考Date-Time Data Representation.For more information, see Financial Charting.

Chart Type Characteristics 图表类型特点
 
 

The table below lists the main characteristics of this chart type.

Feature

Value

Series View type序列视图类型 CandleStickSeriesView
Diagram type 2D-XYDiagram

Number of arguments per series point

每一个序列点的参数数量

1

Number of values per series point

每一个序列点的值数量

4 (Low, High, Open, Close)

4()

Note

For information on which chart types can be combined with the Candle Stick Chart, refer to theCombining Different Series Views document.

Example
 
 
Show Me

The complete sample project is available in the DevExpress Code Central database athttp://www.devexpress.com/example=E1217. Depending on the target platform type (ASP.NET, WinForms, etc), you can either run this example online or download an auto-executable sample.

This example demonstrates how to create aChartControl with a series of the CandleStickSeriesView type, and add this chart to a form at runtime. Before proceeding with this example, first create a Windows Forms Application in Visual Studio, and include allnecessary assemblies to the References list of your project.

Then, add the following code to theForm.Load event handler.

Note that you can exclude non-working days (weekends and holidays) from an axis range, via theAxisBase.WorkdaysOnly andAxisBase.WorkdaysOptions properties. And, to learn which instruments for financial analysis are available in XtraCharts, refer toIndicators.

C#:Form1.cs   VB:Form1.vb  
using System;
using System.Windows.Forms;
using DevExpress.XtraCharts;
// ... private void Form1_Load(object sender, EventArgs e) {
// Create a new chart.
ChartControl candlestickChart = new ChartControl(); // Create a candlestick series.
Series series1 = new Series("Stock Prices", ViewType.CandleStick); // Specify the date-time argument scale type for the series,
// as it is qualitative, by default.
series1.ArgumentScaleType = ScaleType.DateTime; // Add points to it.
series1.Points.Add(new SeriesPoint(new DateTime(1994, 3, 1),
new object[] { 24.00, 25.00, 25.00, 24.875 }));
series1.Points.Add(new SeriesPoint(new DateTime(1994, 3, 2),
new object[] { 23.625, 25.125, 24.00, 24.875 }));
series1.Points.Add(new SeriesPoint(new DateTime(1994, 3, 3),
new object[] { 26.25, 28.25, 26.75, 27.00 }));
series1.Points.Add(new SeriesPoint(new DateTime(1994, 3, 4),
new object[] { 26.50, 27.875, 26.875, 27.25 }));
series1.Points.Add(new SeriesPoint(new DateTime(1994, 3, 7),
new object[] { 26.375, 27.50, 27.375, 26.75 }));
series1.Points.Add(new SeriesPoint(new DateTime(1994, 3, 8),
new object[] { 25.75, 26.875, 26.75, 26.00 }));
series1.Points.Add(new SeriesPoint(new DateTime(1994, 3, 9),
new object[] { 25.75, 26.75, 26.125, 26.25 }));
series1.Points.Add(new SeriesPoint(new DateTime(1994, 3, 10),
new object[] { 25.75, 26.375, 26.375, 25.875 }));
series1.Points.Add(new SeriesPoint(new DateTime(1994, 3, 11),
new object[] { 24.875, 26.125, 26.00, 25.375 }));
series1.Points.Add(new SeriesPoint(new DateTime(1994, 3, 14),
new object[] { 25.125, 26.00, 25.625, 25.75 })); // Add the series to the chart.
candlestickChart.Series.Add(series1); // Access the view-type-specific options of the series.
CandleStickSeriesView myView = (CandleStickSeriesView)series1.View; myView.LineThickness = 2;
myView.LevelLineLength = 0.25; // Specify the series reduction options.
myView.ReductionOptions.Level = StockLevel.Open;
myView.ReductionOptions.Visible = true; // Access the chart's diagram.
XYDiagram diagram = ((XYDiagram)candlestickChart.Diagram); // Access the type-specific options of the diagram.
diagram.AxisY.Range.MinValue = 22; // Exclude weekends from the X-axis range,
// to avoid gaps in the chart's data.
diagram.AxisX.DateTimeScaleOptions.WorkdaysOnly = true; // Hide the legend (if necessary).
candlestickChart.Legend.Visible = false; // Add a title to the chart (if necessary).
candlestickChart.Titles.Add(new ChartTitle());
candlestickChart.Titles[0].Text = "Candlestick Chart"; // Add the chart to the form.
candlestickChart.Dock = DockStyle.Fill;
this.Controls.Add(candlestickChart);
}
 

See Also

 
 
Doughnut Chart

4、环形图

Short Description
 
 

The Doughnut Chart is represented by the DoughnutSeriesView object, which belongs to Pie, Doughnut and Funnel Series Views. This view is useful when it's necessary to compare the percentage values of different point arguments in the same series, and to illustrate these values as easy to understand pie slices, but with a hole in its center.

环形图代表DoughnutSeriesView对象,属于Pie, Doughnut and Funnel Series Views(饼、环和漏斗序列视图集).当需要比较同种序列不同种参数的百分比时非常有用,并显示这些值为简单的饼状切片,但是在中心有一个孔。

A Doughnut chart is shown in the image below. Note that if a chart contains several series of theDoughnutSeriesView type (as well asPieSeriesView), all these series are displayed in the same diagram according to theSimpleDiagram.Dimension and SimpleDiagram.LayoutDirectionproperty values.

下图是一个环形图表。注意,如果一个图表包含几种环形序列视图类型(也包括病状序列视图),所有这些序列依据SimpleDiagram.DimensionandSimpleDiagram.LayoutDirection 属性值在同一个图中显示,

Note that to control the size of the doughnut's hole, use the DoughnutSeriesView.HoleRadiusPercent (or Doughnut3DSeriesView.HoleRadiusPercent) property. For example, in the above image this property is set to0 for the left chart.

控制环形图中孔洞的大小,使用DoughnutSeriesView.HoleRadiusPercent (orDoughnut3DSeriesView.HoleRadiusPercent)属性。举例:上面的图片中,左侧的图表中洞的百分比被设为0.

Chart Type Characteristics 图表类型特色
 
 

The table below lists the main characteristics of this chart type.

Feature

Value

Series View type序列视图类型 DoughnutSeriesView
Diagram type 2D-SimpleDiagram

Number of arguments per series point

每个序列点输入参数值(自变量)个数

1

Number of values per series point

每个序列点输出参数值(因变量)个数

1
Note

For information on which chart types can be combined with the Doughnut Chart, refer to theCombining Different Series Views document.

Example 示例
 
 

The following example demonstrates how to create a ChartControl with a series of the DoughnutSeriesView type, set its general properties, and add this chart to a form at runtime. Before proceeding with this example, first create a Windows Forms Application in Visual Studio, and include allnecessary assemblies to the References list of your project.

如下示例演示使用DoughnutSeriesView类型来创建图表控件,设置通用属性,并添加到运行时窗体。

Then, add the following code to the Form.Load event handler.

  1. using System;
  2. using System.Windows.Forms;
  3. using DevExpress.XtraCharts;
  4. // ...
  5. private void Form1_Load(object sender, EventArgs e) {
  6. // Create a new chart.
  7. ChartControl DoughnutChart = new ChartControl();
  8. // Create a doughnut series.
  9. Series series1 = new Series("Series 1", ViewType.Doughnut);
  10. // Populate the series with points.
  11. series1.Points.Add(new SeriesPoint("Russia", 17.0752));
  12. series1.Points.Add(new SeriesPoint("Canada", 9.98467));
  13. series1.Points.Add(new SeriesPoint("USA", 9.63142));
  14. series1.Points.Add(new SeriesPoint("China", 9.59696));
  15. series1.Points.Add(new SeriesPoint("Brazil", 8.511965));
  16. series1.Points.Add(new SeriesPoint("Australia", 7.68685));
  17. series1.Points.Add(new SeriesPoint("India", 3.28759));
  18. series1.Points.Add(new SeriesPoint("Others", 81.2));
  19. // Add the series to the chart.
  20. DoughnutChart.Series.Add(series1);
  21. // 值的数字化选项,格式化=格式化为百分比.
  22. series1.PointOptions.ValueNumericOptions.Format = NumericFormat.Percent;
  23. series1.PointOptions.ValueNumericOptions.Precision = 0;
  24. // 序列点如何排序:升序,排序键:自变量.
  25. series1.SeriesPointsSorting = SortingMode.Ascending;
  26. series1.SeriesPointsSortingKey = SeriesPointKey.Argument;
  27. //指定序列标签的行为:两列 点视图:自变量和因变量Specify the behavior of series labels.
  28. ((DoughnutSeriesLabel)series1.Label).Position = PieSeriesLabelPosition.TwoColumns;
  29. ((DoughnutSeriesLabel)series1.Label).ResolveOverlappingMode = ResolveOverlappingMode.Default;
  30. ((DoughnutSeriesLabel)series1.Label).ResolveOverlappingMinIndent = 5;
  31. ((PiePointOptions)series1.PointOptions).PointView = PointView.ArgumentAndValues;
  32. // 爆炸点 0 爆照百分比距离 30Adjust the view-type-specific options of the series.
  33. ((DoughnutSeriesView)series1.View).ExplodedPoints.Add(series1.Points[0]);
  34. ((DoughnutSeriesView)series1.View).ExplodedDistancePercentage = 30;
  35. // 维度:2维 Access the diagram's options.
  36. ((SimpleDiagram)DoughnutChart.Diagram).Dimension = 2;
  37. // 添加标题,隐藏图例Add a title to the chart and hide the legend.
  38. ChartTitle chartTitle1 = new ChartTitle();
  39. chartTitle1.Text = "3D Doughnut Chart";
  40. DoughnutChart.Titles.Add(chartTitle1);
  41. DoughnutChart.Legend.Visible = false;
  42. // Add the chart to the form.
  43. DoughnutChart.Dock = DockStyle.Fill;
  44. this.Controls.Add(DoughnutChart);
  45. }
Show Me

The complete sample project is available in the DevExpress Code Central database athttp://www.devexpress.com/example=E1047. Depending on the target platform type (ASP.NET, WinForms, etc), you can either run this example online or download an auto-executable sample.

See Also
 
 
Full-Stacked Area Chart

5、全堆积面积图

Short Description
 
 

The Full-Stacked Area Chart (100% Stacked Area Chart) is represented by theFullStackedAreaSeriesView object, which belongs to Area Series Views. This view displays series as areas on a diagram, so that the value of each data point is stacked with all the other corresponding data points' values. In this instance, the height of the area is always the full height of the chart diagram (i.e. 1). This view is useful for comparing the percentage values of several series for the same point arguments.

全堆积面积图表示FullStackedAreaSeriesView对象,属于面积序列视图集。这种视图在同一个图解(图示)中以面积区域显示序列,因此每一个数据点的值被所有其他相关数据点的值堆满了。在这种情况下,区域的高度通常是图表图解的全部高度(示例1).这在比较相同输入参数(自变量)的几种百分比值输出时非常有用。

A Full-Stacked Area chart is shown in the image below. Note that this chart type is based upon theXYDiagram, so it can be rotated to show bars either vertically or horizontally.

图表类型:XYDiagram,所以可以旋转工具条到水平或垂直位置。

Note

A Full-Stacked Area chart can display series containing data points with positive or negative values. However, a series with positive values is stacked only with other series containing positive values; and a series with negative values is stacked with other series containing negative values.

全覆盖面积图表可以显示正值,也可以显示包含负值数据点的序列。但是,包含正值的序列仅能和其他包含正值的序列一起堆积,包含负值的序列仅能和包含负值的序列一起堆积。

Note that if a series contains data points with both positive and negative values, it is treated as a series with positive values, while all its negative values are treated as zeros.

如果一个序列既包含正数也包含负数的值,将被看做是正数序列,序列中的所有负值被当做零值。

Chart Type Characteristics
 
 

图表类型特性

The table below lists the main characteristics of this chart type.

Feature

Value

Series View type FullStackedAreaSeriesView
Diagram type 2D-XYDiagram
Number of arguments per series point 1
Number of values per series point 1
Note

For information on which chart types can be combined with the Full-Stacked Area Chart, refer to theCombining Different Series Views document.

Example
 
 

The following example demonstrates how to create a ChartControl with two series of the FullStackedAreaSeriesView type, and add this chart to a form at runtime. Before proceeding with this example, first create a Windows Forms Application in Visual Studio, and include allnecessary assemblies to the References list of your project.

Then, add the following code to the Form.Load event handler.

下面示例演示了如何创建一个有两个FullStackedAreaSeriesView类型序列的图表控件,并在运行时添加图表到窗体。

 
C#
using DevExpress.XtraCharts;
// ... private void Form1_Load(object sender, EventArgs e) {
// Create a new chart.
ChartControl FullStackedAreaChart = new ChartControl(); // Create two full-stacked area series.
Series series1 = new Series("Series 1", ViewType.FullStackedArea);
Series series2 = new Series("Series 2", ViewType.FullStackedArea); // Add points to them.
series1.Points.Add(new SeriesPoint(1, 10));
series1.Points.Add(new SeriesPoint(2, 12));
series1.Points.Add(new SeriesPoint(3, 14));
series1.Points.Add(new SeriesPoint(4, 17)); series2.Points.Add(new SeriesPoint(1, 15));
series2.Points.Add(new SeriesPoint(2, 18));
series2.Points.Add(new SeriesPoint(3, 25));
series2.Points.Add(new SeriesPoint(4, 33)); // Add both series to the chart.
FullStackedAreaChart.Series.AddRange(new Series[] { series1, series2 }); // 设置参数类型为数值型,因为默认为定性类型参数 Set the numerical argument scale types for the series,
// as it is qualitative, by default.
series1.ArgumentScaleType = ScaleType.Numerical;
series2.ArgumentScaleType = ScaleType.Numerical; // Access the view-type-specific options of the series.
((FullStackedAreaSeriesView)series1.View).Transparency = 50;
((FullStackedAreaSeriesView)series2.View).Transparency = 50; //获取图解控制 Access the type-specific options of the diagram.
((XYDiagram)FullStackedAreaChart.Diagram).EnableAxisXZooming = true; // Hide the legend (if necessary).
FullStackedAreaChart.Legend.Visible = false; // Add the chart to the form.
FullStackedAreaChart.Dock = DockStyle.Fill;
this.Controls.Add(FullStackedAreaChart);
}
VB
 
Show Me

The complete sample project is available in the DevExpress Code Central database athttp://www.devexpress.com/example=E1207. Depending on the target platform type (ASP.NET, WinForms, etc), you can either run this example online or download an auto-executable sample.

See Also
 
 
Full-Stacked Bar Chart

6、全部堆叠条形图

Short Description
 
 

The Full-Stacked Bar Chart (100%-Stacked Bar Chart) is represented by the FullStackedBarSeriesView object, which belongs to Bar and Column Series Views. This view displays all series stacked, with a single bar for each category. The height of each bar is always the full height of the chart diagram (i.e. 1). The series values are displayed as percentages of each bar.

全部堆叠条形图用FullStackedBarSeriesView对象表示,属于条和列序列视图集Bar and Column Series Views。这种类型将堆叠显示所有序列,每一个条状代表一个类别。

A Full-Stacked Bar chart is shown in the image below. Note that this chart type is based upon the XYDiagram, and so it can be rotated to show bars either vertically or horizontally.

Note

A Full-Stacked Bar chart can display series containing data points with positive or negative values. However, a series with positive values is stacked only with other series containing positive values; and a series with negative values is stacked with other series containing negative values.

Note that if a series contains data points with both positive and negative values, it is treated as a series with positive values, while all its negative values are treated as zeros.

Chart Type Characteristics
 
 

The table below lists the main characteristics of this chart type.

Feature

Value

Series View type FullStackedBarSeriesView
Diagram type 2D-XYDiagram
Number of arguments per series point 1
Number of values per series point 1
Note

For information on which chart types can be combined with the Full-Stacked Bar Chart, refer to the Combining Different Series Views document.

Example
 
 

The following example demonstrates how to create a ChartControl with two series of the FullStackedBarSeriesView type, and add this chart to a form at runtime. Before proceeding with this example, first create a Windows Forms Application in Visual Studio, and include all necessary assemblies to the References list of your project.

Then, add the following code to the Form.Load event handler.

C#
using DevExpress.XtraCharts;
// ... private void Form1_Load(object sender, EventArgs e) {
// Create a new chart.
ChartControl FullStackedBarChart = new ChartControl(); // Create two full-stacked bar series.
Series series1 = new Series("Series 1", ViewType.FullStackedBar);
Series series2 = new Series("Series 2", ViewType.FullStackedBar); // Add points to them.
series1.Points.Add(new SeriesPoint(1, 10));
series1.Points.Add(new SeriesPoint(2, 12));
series1.Points.Add(new SeriesPoint(3, 14));
series1.Points.Add(new SeriesPoint(4, 17)); series2.Points.Add(new SeriesPoint(1, 15));
series2.Points.Add(new SeriesPoint(2, 18));
series2.Points.Add(new SeriesPoint(3, 25));
series2.Points.Add(new SeriesPoint(4, 33)); // Add both series to the chart.
FullStackedBarChart.Series.AddRange(new Series[] { series1, series2 }); // Set the numerical argument scale types for the series,
// as it is qualitative, by default.
series1.ArgumentScaleType = ScaleType.Numerical;
series2.ArgumentScaleType = ScaleType.Numerical; // Access the view-type-specific options of the series.
((FullStackedBarSeriesView)series1.View).BarWidth = 0.4; // Access the type-specific options of the diagram.
((XYDiagram)FullStackedBarChart.Diagram).EnableAxisXZooming = true; // Hide the legend (if necessary).
FullStackedBarChart.Legend.Visible = false; // Add the chart to the form.
FullStackedBarChart.Dock = DockStyle.Fill;
this.Controls.Add(FullStackedBarChart);
}
   
Show Me

The complete sample project is available in the DevExpress Code Central database at http://www.devexpress.com/example=E1206. Depending on the target platform type (ASP.NET, WinForms, etc), you can either run this example online or download an auto-executable sample.

See Also
 
 
Full-Stacked Line Chart

7、全堆折线图

Short Description
 
 

The Full-Stacked Line Chart (100%-Stacked Line Chart) is represented by the FullStackedLineSeriesView object, which belongs to Point, Line and Spline Series Views. This chart is useful when it is necessary to compare how much each series adds to the total aggregate value for specific arguments.

对于指定参数,全堆叠折线图用来比较每一个序列添加到合计值中的比例。比如对于USA,Hydro-electric(水力发电)占3%,Oil石油站40,%,总共占能源中的43%,Natural gas(天然气)占25%,三种能源一起占总能源的68%。

全堆折线图用FullStackedLineSeriesView对象表示,属于点,线和样条序列视图集Point, Line and Spline Series Views.在比较

A Full-Stacked Line chart is shown in the image below. Note that this chart type is based upon XYDiagram, and so it can be rotated to show lines either vertically or horizontally.

Note

A Full-Stacked Line chart can display series containing data points with positive or negative values. However, a series with positive values is stacked only with other series containing positive values; and a series with negative values is stacked with other series containing negative values.

Note that if a series contains data points with both positive and negative values, it is treated as a series with positive values, while all its negative values are treated as zeros.

Chart Type Characteristics
 
 

The table below lists the main characteristics of this chart type.

Feature

Value

Series View type FullStackedLineSeriesView
Diagram type 2D-XYDiagram
Number of arguments per series point 1
Number of values per series point 1
Note

For information on which chart types can be combined with the Full-Stacked Line Chart, refer to the Combining Different Series Views document.

Full-Stacked Spline Area Chart

8、全堆积样条面积图表

Short Description
 
 

The Full-Stacked Spline Area Chart (100% Stacked Spline Area Chart) is represented by the FullStackedSplineAreaSeriesView object, which belongs to Area Series Views. This view is similar to Full-Stacked Area Chart, but plots a fitted curve through each data point in a series.

全堆积样条面积图表用FullStackedSplineAreaSeriesView对象表示,属于面积序列视图集,与全堆积面积图表类似,但是绘制一个通过各序列点的拟合曲线。

A Full-Stacked Spline Area chart is shown in the image below. Note that this chart type is based upon the XYDiagram, so it can be rotated to show bars either vertically or horizontally.

Note

A Full-Stacked Spline Area chart can display series containing data points with positive or negative values. However, a series with positive values is stacked only with other series containing positive values; and a series with negative values is stacked with other series containing negative values.

Note that if a series contains data points with both positive and negative values, it is treated as a series with positive values, while all its negative values are treated as zeros.

Chart Type Characteristics
 
 

The table below lists the main characteristics of this chart type.

Feature

Value

Series View type FullStackedSplineAreaSeriesView
Diagram type 2D-XYDiagram
Number of arguments per series point 1
Number of values per series point 1
Note

For information on which chart types can be combined with the Full-Stacked Spline Area Chart, refer to the Combining Different Series Viewsdocument.

Example
 
 

The following example demonstrates how to create a ChartControl with a series of the FullStackedSplineAreaSeriesView type, set its general properties, and add this chart to a form at runtime. Before proceeding with this example, first create a Windows Forms Application in Visual Studio, and include all necessary assemblies to the References list of your project.

Then, add the following code to the Form.Load event handler.

C#
using System;
using System.Windows.Forms;
using DevExpress.XtraCharts;
// ... private void Form1_Load(object sender, EventArgs e) {
// Create an empty chart.
ChartControl fullStackedSplineAreaChart = new ChartControl(); // Create two series of the FullStackedSplineArea view type.
Series series1 = new Series("Series 1", ViewType.FullStackedSplineArea);
Series series2 = new Series("Series 2", ViewType.FullStackedSplineArea); // Populate both series with points.
series1.Points.Add(new SeriesPoint("A", 80));
series1.Points.Add(new SeriesPoint("B", 20));
series1.Points.Add(new SeriesPoint("C", 50));
series1.Points.Add(new SeriesPoint("D", 30));
series2.Points.Add(new SeriesPoint("A", 40));
series2.Points.Add(new SeriesPoint("B", 60));
series2.Points.Add(new SeriesPoint("C", 20));
series2.Points.Add(new SeriesPoint("D", 80)); // Add the series to the chart.
fullStackedSplineAreaChart.Series.AddRange(new Series[] {
series1,
series2}); // Adjust the view-type-specific options of the series.
((FullStackedSplineAreaSeriesView)series1.View).LineTensionPercent = 80;
((FullStackedSplineAreaSeriesView)series2.View).Transparency = 80; // Access the diagram's options.
((XYDiagram)fullStackedSplineAreaChart.Diagram).Rotated = true; // Add a title to the chart and hide the legend.
ChartTitle chartTitle1 = new ChartTitle();
chartTitle1.Text = "Full Stacked Spline Area Chart";
fullStackedSplineAreaChart.Titles.Add(chartTitle1);
fullStackedSplineAreaChart.Legend.Visible = false; // Add the chart to the form.
fullStackedSplineAreaChart.Dock = DockStyle.Fill;
this.Controls.Add(fullStackedSplineAreaChart);
}

ChartConlrol二维图表类型的更多相关文章

  1. 案例分享:Qt西门子机床人机界面以及数据看板定制(西门子通讯,mysql数据库,生产信息,参数信息,信息化看板,权限控制,播放器,二维图表,参数调试界面)

    若该文为原创文章,转载请注明原文出处本文章博客地址:https://blog.csdn.net/qq21497936/article/details/118685521 长期持续带来更多项目与技术分享 ...

  2. C语言二维数组超细讲解

    用一维数组处理二维表格,实际是可行的,但是会很复杂,特别是遇到二维表格的输入.处理和输出. 在你绞尽脑汁的时候,二维数组(一维数组的大哥)像电视剧里救美的英雄一样显现在你的面前,初识数组的朋友们还等什 ...

  3. ios-深度解析二维码的生成与使用

    利用一个小demo来对二维码进行学习,总共四个界面(主界面,生成二维码界面,识别二维码界面,扫描二维码界面)   一.二维码的介绍   1.什么是二维码?        二维条码/二维码是用某种特定的 ...

  4. c++ 二维数组传递

    c++ 二维数组传递 我们在传递二维数组时,对于新手来说,可能会存在某些问题,下面讲解几种传递方法 在讲解如何传递二维数组时,先看看如何动态new 二维数组 // 二维数组动态申请 int row , ...

  5. iOS--iOS7摄像头识别二维码功能

    iOS–iOS7摄像头识别二维码功能 属性介绍: AVFoundation 框架基于以下几个类实现图像捕捉 ,通过这些类可以访问来自相机设备的原始数据并控制它的组件. AVCaptureDevice ...

  6. windows rt 扫描二维码

    项目中使用的是ZXing.net,应用商店程序.使用到的dll是ZXing.winmd. 大致思路为,使用MediaCapture捕获图片.获取到CapturePhotoToStreamAsync流, ...

  7. 使用zxing生成解析二维码

    1. 前言 随着移动互联网的发展,我们经常在火车票.汽车票.快餐店.电影院.团购网站以及移动支付等各个场景下见到二维码的应用,可见二维码以经渗透到人们生活的各个方面.条码.二维码以及RFID被人们应用 ...

  8. 用Arduino制作一个二维码显示器

    先上图 场景是这样的, 这几天给CS系统做一个微信支付的功能,  但是生成的二维码是在前台的电脑上..不可能让用户跑到前台的电脑上去扫描...然后拿出了N年前买的Arduino 做了一个二维码显示器. ...

  9. 微信公众号开发C#系列-11、生成带参数二维码应用场景

    1.概述 我们在微信公众号开发C#系列-7.消息管理-接收事件推送章节有对扫描带参数二维码事件的处理做了讲解.本篇主要讲解通过微信公众号开发平台提供的接口生成带参数的二维码及应用场景. 微信公众号平台 ...

随机推荐

  1. Ehcache RIM

    Ehcache不仅支持基本的内存缓存,还支持多种方式将本地内存中的缓存同步到其他使用Ehcache的服务器中,形成集群.如下图所示:   Ehcache支持多种集群方式,下面以RMI通信方式为例,来具 ...

  2. 有二级目录的IIS配置

    当项目配置文件中配置了二级目录时,如下: <!--二级目录地址--> <add key="SecondCatalog" value="/hotel&qu ...

  3. mvc 日历控件

    第二个是日历控件,在网上查了一个普通的日历控件,也生成了下拉的日历样子,但是一些脚本比如选择年月,需要一些时间,最后只好套用了My97 DatePicker,这样以来其实简单多了. 第一步:下载 My ...

  4. 并查集+二分-hdu-4750-Count The Pairs

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=4750 题目大意: 给一无向图,n个点,m条边,每条边有个长度,且不一样.定义f(i,j)表示从节点i ...

  5. ubuntu WiFi: operation not possible due to RF-kill《转载》

    Some people have been experiencing WiFi problems with Ubuntu 10.10 since an update that happend just ...

  6. javascript模式——Decorator

    Decorator 模式是一种结构型模式,他意在促进代码的复用,是塑造子类的一个方式. 这种想法是基于,新增的属性,对于对象来说不是必须的基本功能.我们为特殊的对象添加自己的方法,而不是重新创建一个类 ...

  7. JS获取request字符串

    function getQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&] ...

  8. 初识nginx+tomcat

    百度百科说: Nginx ("engine x") 是一个高性能的HTTP和反向代理服务器,也是一个IMAP/POP3/SMTP服务器.Nginx是由Igor Sysoev为俄罗斯 ...

  9. 利用monkeyrunner实现Android屏幕连续截图

    MonkeyRunner 什么是monkeyrunner monkeyrunner工具提供了一个API,使用此API写出的程序可以在Android代码之外控制Android设备和模拟器.通过monke ...

  10. C与C++

    有幸在某网站发现这篇文章,读罢,觉得蛮有道理,发来大家一起共勉之! 总是被同学们问到,如何学习C和C++才不茫然,才不是乱学,想了一下,这里给出一个总的回复. 一家之言,欢迎拍砖哈. 1.可以考虑先学 ...