【TeeChart .NET教程】（四）轴控制

本文详细介绍轴控制的实际应用

【下载TeeChart.Net最新版本】

TeeChart Pro将自动为用户定义所有Axis标签，并提供足够的灵活性来定制用户可能具有的任何特定要求，TeeChart Pro提供真正的多轴，它们可在设计或运行时使用，并为Axis定义提供无数可能性和灵活性，本教程将介绍轴控制的应用：

（一）轴控制——关键领域

1.1Scales——缩放

将系列数据添加到图表时，会自动设置轴刻度，用户可以使用Axis属性在设计时或运行时更改默认值。

Non date-time data——非日期时间数据

添加新系列时，TeeChart编辑器的Axis页面的Scales部分将显示Automatic selected和其他灰色选项。显示的所有值均为数字。

Date-time data——日期时间数据

当系列在Series（系列） —>General（常规）页面上将日期时间设置为true（对于该轴）时，TeeChart编辑器的轴页面的“Scales（缩放）”部分将显示“Auto（自动选定）”和其他灰色选项。值显示为日期时间值。
自动选择最佳轴刻度范围以适合用户的数据，在设计时使用TeeChart编辑器将线系列添加到图表，然后使用以下代码添加命令按钮：

[C#.Net]

Random rnd = new Random();for(int i = 0; i <= 40; ++i)line1.Add(Convert.ToDouble(i),rnd.Next(100),Color.Red); 

[VB.Net]

Dim i As IntegerFor i = 0 To 40   Line1.Add(Convert.ToDouble(i), Rnd() * 100, Color.Red)Next i 

在按钮中运行代码将绘制一个包含40个随机值的Line Series。在设计时转到TeeChart编辑器，在“Axis（轴）”页面的“Bottom Axis scales（底轴刻度）”部分中，将“Auto（自动）”设置为“off’（关闭）”。现在可以配置轴刻度的最大值和最小值，再次运行代码将显示值，具体取决于用户为Axis配置的值，使用鼠标右键可以滚动查看剩余值。

按代码设置轴刻度

更改最大值和最小值代码：

[C#.Net]

Steema.TeeChart.Axis bottomAxis = tChart1.Axes.Bottom;bottomAxis.Automatic = false;bottomAxis.Maximum = 36;bottomAxis.Minimum = 5; 

[VB.Net]

With TChart1.Axes.Bottom   .Automatic = False   .Maximum = 36   .Minimum = 5End With 

将Axis scale Maximum和Minimum设置为自动代码：

[C#.Net]

Steema.TeeChart.Axis bottomAxis = tChart1.Axes.Bottom;bottomAxis.AutomaticMaximum = true;bottomAxis.AutomaticMinimum = false;bottomAxis.Minimum = 5; 

[VB.Net]

With TChart1.Axes.Bottom   .AutomaticMaximum = True   .AutomaticMinimum = False   .Minimum = 5End With 

1.2 Increment——增量

用户可以自定义轴的间隔，从Axis页面的Scales部分选择Desired Increment组合框，并添加所需的增量，代码： 

[C#.Net]

Steema.TeeChart.Axis bottomAxis = tChart1.Axes.Bottom;bottomAxis.Increment = 20; 

[VB.Net]

With TChart1.Axes.Bottom   .Increment = 20End With 

Datetime data：日期型数据

如果数据是datetime（可以通过转到Series，General页面将数据设置为系列的datetime），Chart-> Axis页面的scale部分将显示日期时间范围。从Desired Increment组合框中显示的范围中选择增量，并添加一些样本数据：

[C#.Net]

Random rnd = new Random();DateTime today = DateTime.Today;TimeSpan oneDay = TimeSpan.FromDays(1);line1.XValues.DateTime = true;for(int i = 1; i <= 25; ++i)      line1.Add(today,rnd.Next(100),Color.Red);     today += oneDay; 

[VB.Net]

Dim i As IntegerDim Today As DateTime = DateTime.TodayDim OneDay As TimeSpan = TimeSpan.FromDays(1)Line1.XValues.DateTime = TrueFor i = 1 To 25     Line1.Add(Today, Rnd() * 100, Color.Red)     Today = Today.Add(OneDay)Next 

在运行时更改增量：

[C#.Net]

Steema.TeeChart.Axis bottomAxis = tChart1.Axes.Bottom;bottomAxis.Increment = Steema.TeeChart.Utils.GetDateTimeStep(Steema.TeeChart.DateTimeSteps.TwoDays); 

[VB.Net]

With TChart1.Axes.Bottom   .Increment = Steema.TeeChart.Utils.GetDateTimeStep(Steema.TeeChart.DateTimeSteps.TwoDays)End With 

有关日期轴标签的更多信息，请参阅AxisLabels.ExactDateTime属性。

注意：

更改轴标签频率时，TeeChart将根据AxisLabels.Separation属性的设置避免标签重叠。这意味着如果标签频率太高而不适合标签，那么TeeChart将分配“最适合”。更改标签角度和标签分离是2个选项，可帮助用户安装所需的标签。

1.3 Titles——标题

标题设置在Axis页面的标题部分，用户可以更改Axis的标题文本及其字体和阴影属性，还可以指定标题文本的角度和大小。

注意：

更改轴标签频率时，TeeChart将根据AxisLabels.Separation属性的设置避免标签重叠。这意味着如果标签频率太高而不适合标签，那么TeeChart将分配“最适合”。更改标签角度和标签分离是2个选项，可帮助用户安装所需的标签。

1.4 标签格式：

用户可以将所有标准数字和日期格式应用于Axis标签。“Axis（轴）”页面的“Labels（标签）”部分包含“Values format（值格式）”字段。如果数据是datetime，则字段名称将更改为“Date time format”，在运行时使用代码：

[C#.Net]

tChart1.Axes.Bottom.Labels.ValueFormat = "#,##0.00;(#,##0.00)"; 

[VB.Net]

With TChart1.Axes.Bottom   .Labels.ValueFormat = "#,##0.00;(#,##0.00)"End With 

或者用于日期时间数据

[C#.Net]

tChart1.Axes.Bottom.Labels.DateTimeFormat =“dddd / MMMM / yyyy”; 

[VB.Net]

With TChart1.Axes.Bottom   .Labels.DateTimeFormat = "dddd/MMMM/yyyy"End With 

1.5 MultiLine标签

轴标签可以显示为多行文本而不是单行文本，使用LineSeparator字符（）分隔行。

例：

[C#.Net]

bar1.Add（1234，“New”+ Steema.TeeChart.Texts.LineSeparator +“Cars”，Color.Red）;bar1.Add（2000，“Old”+ Steema.TeeChart.Texts.LineSeparator +“Bicycles”，Color.Red）;tChart1.Panel.MarginBottom = 10; 

[VB.Net]

Bar1.Add(1234, "New" + Steema.TeeChart.Texts.LineSeparator + "Cars", Color.Red)Bar1.Add(2000, "Old" + Steema.TeeChart.Texts.LineSeparator + "Bicycles", Color.Red)TChart1.Panel.MarginBottom = 10

DateTime标签的示例：

以下将在两行文本中显示底部轴标签，一行显示月份和日期，第二行显示年份：

• Feb-28 Mar-1 ..
• 2003 2003 ..

[C#.Net]

bar1.Add（DateTime.Parse（“28/2/2003”），100，Color.Red）;bar1.Add（DateTime.Parse（“1/3/2003”），200，Color.Red）;bar1.Add（DateTime.Parse（“2/3/2003”），150，Color.Red）;bar1.XValues.DateTime = true;tChart1.Axes.Bottom.Labels.DateTimeFormat =“MM / dd hh：mm”;tChart1.Axes.Bottom.Labels.MultiLine = true;tChart1.Panel.MarginBottom = 10;

[VB.Net]

Bar1.Add(DateValue("28/2/2003"), 100, Color.Red)Bar1.Add(DateValue("1/3/2003"), 200, Color.Red)Bar1.Add(DateValue("2/3/2003"), 150, Color.Red)Bar1.XValues.DateTime = TrueTChart1.Axes.Bottom.Labels.DateTimeFormat = "MM/dd hh:mm"TChart1.Axes.Bottom.Labels.MultiLine = TrueTChart1.Panel.MarginBottom = 10 

将AxisLabels.MultiLine属性设置为True将自动在有空格的行中拆分标签，有效地将Label分为两个：

第一行：’mm / dd’

第二行：’hh：mm’   
在运行时始终可以使用OnGetAxisLabel事件以编程方式将标签拆分为多行：

[C#.Net]

private void tChart1_GetAxisLabel(object sender, Steema.TeeChart.TChart.GetAxisLabelEventArgs e)             string myLabelText = e.LabelText;            tChart1.Axes.Bottom.Labels.SplitInLines(ref myLabelText, " ");            e.LabelText = myLabelText; 

[VB.Net]

Private Sub TChart1_GetAxisLabel(ByVal sender As Object, ByVal e As Steema.TeeChart.TChart.GetAxisLabelEventArgs) Handles TChart1.GetAxisLabel        Dim myLabelText As String        myLabelText = e.LabelText        TChart1.Axes.Bottom.Labels.SplitInLines(myLabelText, " ")        e.LabelText = myLabelTextEnd Sub 

在上面的示例中，全局“TeeSplitInLines”过程将“LabelText”中的所有空格转换为行分隔符（返回），轴AxisLabels.Angle属性也可用于多线轴标签。

Customising Axis labels——自定义轴标签
可以通过使用Axis事件获得进一步的Label控制。事件允许用户激活/停用/更改任何单个Axis标签。以下示例修改每个Label，将文本短语放在点索引值的前面：

[C#.Net]

private void button1_Click(object sender, System.EventArgs e)             bar1.FillSampleValues(20);            tChart1.Axes.Bottom.Labels.Style = AxisLabelStyle.Mark; private void tChart1_GetAxisLabel(object sender, Steema.TeeChart.TChart.GetAxisLabelEventArgs e)             if(((Steema.TeeChart.Axis)sender).Equals(tChart1.Axes.Bottom))            e.LabelText = "Period " + Convert.ToString(e.ValueIndex);

[VB.Net]

Private Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click        Bar1.FillSampleValues(20)        TChart1.Axes.Bottom.Labels.Style = Steema.TeeChart.AxisLabelStyle.MarkEnd SubPrivate Sub TChart1_GetAxisLabel(ByVal sender As Object, ByVal e As Steema.TeeChart.TChart.GetAxisLabelEventArgs) Handles TChart1.GetAxisLabel        If CType(sender, Steema.TeeChart.Axis) Is TChart1.Axes.Bottom Then            e.LabelText = "Period " & e.ValueIndex        End IfEnd Sub 

1.6 Logarithmic Labels——指数标签

正常对数标记可以通过以下方式设置： 

[C#.Net]

private void button1_Click(object sender, System.EventArgs e)             Random rnd = new Random();            Steema.TeeChart.Axis leftAxis = tChart1.Axes.Left;            tChart1.Aspect.View3D = false;            bar1.Marks.Visible = false;            for(int i = 0; i <= 100; ++i)            bar1.Add(rnd.Next(100) * i);            leftAxis.LogarithmicBase = 10;            leftAxis.Logarithmic = true;            leftAxis.SetMinMax(0, 10000);            leftAxis.Labels.ValueFormat = "#e+0";   

[VB.Net]

Private Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click        Dim i As Integer        TChart1.Aspect.View3D = False        Bar1.Marks.Visible = False        For i = 0 To 10000 Step 100            Bar1.Add(Rnd() * i)        Next        With TChart1.Axes.Left            .LogarithmicBase = 10            .Logarithmic = True            .SetMinMax(0, 10000)            .Labels.ValueFormat = "#e+0" ' exponential format         End WithEnd Sub 

 标签将根据对数基数（默认为10）进行设置，因此，在这种情况下给出标签为1,10,100,1000,10000。

1.7 Ticks and Minor——勾选和次要

有3种勾选类型和2种类型的网格，用户可以更改每个刻度和网格类型的长度，宽度和颜色。可以通过“Ticks”选项卡对Ticks及其关联的Grid和Inner Ticks进行更改； 可以通过“Minor（次要）”选项卡更改次要刻度及其关联的网格。TeeChart Pro版本5的新功能是能够更改宽度大于1（默认值）的刻度和网格样式。

[C#.Net]

Steema.TeeChart.Axis bottomAxis = tChart1.Axes.Bottom;bottomAxis.Ticks.Length = 7;bottomAxis.Ticks.Color = Color.Green;bottomAxis.MinorTickCount = 10;   

[VB.Net]

With TChart1.Axes.Bottom   .Ticks.Length = 7   .Ticks.Color = Color.Green   .MinorTickCount = 10End With

Axis position——轴位置 
轴具有修改每个轴所在位置的属性。在此示例中，轴移动了图表宽度的50％，因此它显示在图表中心：

[C#.Net]

Steema.TeeChart.Axis bottomAxis = tChart1.Axes.Bottom;bottomAxis.PositionUnits = PositionUnits.Percent;bottomAxis. RelativePosition = 50 

[VB.Net]

With TChart1.Axes.Bottom   .PositionUnits = PositionUnits.Percent   .RelativePosition = 50End With

（二）Additional Axes——附加轴

2.1 Copying axes——复制轴

TeeChart提供5个与数据相关的轴系列：Left（左），Top（上），Bottom（下），Right（右）和 Depth（深）。向图表添加新系列时，用户可以定义系列应与哪些轴相关（转到“Series（系列）”选项卡“General（常规）”页面），可以使用Axis Customdraw方法在图表上的任何位置重复前4轴中的任何一个（或全部）。此方法会复制Axis，但不会添加新的自定义轴。

例：

[C#.Net]

private void Form1_Load(object sender, System.EventArgs e)             Random Rnd = new Random();            tChart1.Aspect.View3D = false;            tChart1.Panel.Gradient.Visible = true;            for(int t = 0; t <= 20; ++t)            line1.Add(t, ((Rnd.Next(100)) + 1) - ((Rnd.Next(70)) + 1), Color.Red); private void line1_BeforeDrawValues(object sender, Steema.TeeChart.Drawing.Graphics3D g)             int posAxis = 0;            if(tChart1.Axes.Left.Maximum > 0)                     tChart1.Axes.Left.Draw(g.ChartXCenter - 10,g.ChartXCenter - 20,g.ChartXCenter,true);                posAxis = tChart1.Axes.Left.CalcYPosValue(10);                tChart1.Axes.Bottom.Draw(posAxis + 10, posAxis + 40, posAxis, true); 

[VB.Net]

Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load        Dim t As Integer        TChart1.Aspect.View3D = False        TChart1.Panel.Gradient.Visible = True        For t = 0 To 20            Line1.Add(t, ((Rnd() * 100) + 1) - ((Rnd() * 70) + 1), Color.Red)        Next    End SubPrivate Sub Line1_BeforeDrawValues(ByVal sender As Object, ByVal g As Steema.TeeChart.Drawing.Graphics3D) Handles Line1.BeforeDrawValues        Dim posAxis As Integer        If TChart1.Axes.Left.Maximum > 0 Then            TChart1.Axes.Left.Draw(g.ChartXCenter - 10, g.ChartXCenter - 20, g.ChartXCenter, True)            posAxis = TChart1.Axes.Left.CalcYPosValue(10)            TChart1.Axes.Bottom.Draw(posAxis + 10, posAxis + 40, posAxis, True)        End IfEnd Sub

上面的示例代码将生成以下图像： 

2.2 自定义轴

在此示例中，TeeChart将绘制新轴，一个水平，一个垂直位于图表的中心。当用户滚动图表（用鼠标右键拖动）时，新的垂直轴将始终保持在图表的中心，新的水平轴将垂直滚动上下移动，新轴是默认轴的精确副本。

2.3 多个自定义轴

与PositionPercent和拉伸属性一起，可以使无限轴浮动到图表上的任何位置。滚动，缩放和轴命中检测也适用于自定义创建的轴。现在可以通过TeeChart Editor在设计时创建额外的轴，也可以在运行时通过几行代码创建额外的轴：

通过图表编辑器

TeeChart为用户提供在设计时创建自定义轴的功能，使其能够以TeeChart的T恤文件格式保存。打开图表编辑器并单击“Axis（轴）”选项卡，然后选择“+”按钮以添加自定义轴。然后选择“Position（位置）”选项卡，确保突出显示新的自定义轴。此页面上的“ Horizontal（水平）”复选框允许用户将新的自定义轴定义为水平轴或将其保留为默认垂直轴。如上所述，此页面的其余部分和Axis页面中的其他选项卡可用于更改自定义轴的比例，增量，标题，标签，刻度，次刻度和位置。要将此新的自定义轴与所需的数据系列相关联，请选择“Series（系列）”选项卡，然后转到“General（常规）”页面，其中下拉组合框“Horizontal Axis（水平轴）”和“Vertical Axis（垂直轴）”将允许用户选择新的自定义轴，具体取决于用户之前是将其定义为垂直轴还是水平轴。

代码：

[C#.Net]

private void Form1_Load(object sender, System.EventArgs e)             Line line1 = new Line();            Line line2 = new Line();             tChart1.Aspect.View3D = false;            tChart1.Panel.Gradient.Visible = true;            tChart1.Header.Text = "TeeChart Multiple Axes";            tChart1.Series.Add(line1);            tChart1.Series.Add(line2);            for(int t = 0; t <= 10; ++t)                     line1.Add(Convert.ToDouble(t), Convert.ToDouble(10 + t), Color.Red);                if(t > 1)                line2.Add(Convert.ToDouble(t), Convert.ToDouble(t), Color.Green);             Axis leftAxis = tChart1.Axes.Left;            leftAxis.StartPosition = 0;            leftAxis.EndPosition = 50;            leftAxis.AxisPen.Color = Color.Red;            leftAxis.Title.Font.Color = Color.Red;            leftAxis.Title.Font.Bold = true;            leftAxis.Title.Text = "1st Left Axis";            Axis axis1 = new Axis(false, false, tChart1.Chart);            tChart1.Axes.Custom.Add(axis1);            line2.CustomVertAxis = axis1;            axis1.StartPosition = 50;            axis1.EndPosition = 100;            axis1.AxisPen.Color = Color.Green;            axis1.Title.Font.Color = Color.Green;            axis1.Title.Font.Bold = true;            axis1.Title.Text = "Extra Axis";            axis1.PositionUnits= PositionUnits.Percent;            axis1.RelativePosition = 20; 

标签：图表teechart

来源：慧都