轴
加入官方社群740060302,欢迎相互交流
TeeChart Pro将自动为您定义所有Axis标签,并提供足够的灵活性来定制您可能拥有的任何特定要求。TeeChart Pro提供真正的多轴。它们在设计或运行时可用,并为Axis定义提供了无数的可能性和灵活性。有关更多信息,请参阅本教程中的内容。
轴控制-关键区域
刻度
将系列数据添加到图表时,将自动设置轴刻度。您可以在设计时或运行时使用Axis属性更改默认值。
非日期-时间数据
添加新系列时,图表编辑器轴页的刻度部分将显示自动选中,其他选项显示为灰色。所有显示的值都是数字。
日期-时间数据
当Series -> General页面上的Series日期时间设置为true(对于该轴)时,图表编辑器的axis页面的Scales部分将显示自动选中,而其他选项将显示为灰色。值与日期-时间值一起显示。
自动选择最佳的轴刻度范围,以适应您的数据。如果您关闭自动缩放部分将取消灰色选项,您可以更改轴值。重要的是,请记住从页面左侧的坐标轴列表中选择要配置的坐标轴。
在设计时使用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 Integer For i = 0 To 40 Line1.Add(Convert.ToDouble(i), Rnd() * 100, Color.Red) Next i
运行按钮中的代码将绘制具有40个随机值的Line Series。在设计时转到图图编辑器。在轴页面的底部轴缩放部分将自动“关闭”。您现在可以为Axis比例配置最大值和最小值。再次运行代码将显示值,这取决于您为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 = 5 End With
您可以单独设置轴缩放最大值和最小值为自动。例如:
[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 = 5 End With
增量
您可以为轴调整间隔。从Axis页面的Scales部分选择Desired Increment组合框,并添加所需的增量。你可以在运行时修改代码:
[C#.Net] Steema.TeeChart.Axis bottomAxis = tChart1.Axes.Bottom; bottomAxis.Increment = 20; [VB.Net] With TChart1.Axes.Bottom .Increment = 20 End With
Datetime数据
如果您的数据是日期时间(您可以通过转到系列,常规页面为您的系列设置数据为日期时间),Series -> General页面,刻度部分将显示日期时间范围。从期望增量组合框中显示的范围中选择增量,并添加一些示例数据:
[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 Integer Dim Today As DateTime = DateTime.Today Dim OneDay As TimeSpan = TimeSpan.FromDays(1) Line1.XValues.DateTime = True For 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属性获取有关日期轴标记的更多信息。
请注意
当更改轴标签频率时,请记住,根据AxisLabels的设置,TeeChart将避免AxisLabels.Separation属性。这意味着如果标签频率太高,标签无法匹配,那么TeeChart将分配“best fit”。改变标签角度和标签分隔是两个选项,可以帮助你适应你需要的标签。请参阅Labels和AxisLabels.Angle属性部分。
Titles
在Axis页面的标题部分设置标题。您可以更改轴的标题文本及其字体和阴影属性。也可以指定标题文本的角度和大小。有关运行时,请参阅AxisTitle类。
Labels
有关标签属性的恢复,请参见AxisLabels类。
请注意
当更改轴标签频率时,请记住,根据AxisLabels的设置,TeeChart将避免AxisLabels.Separation属性。这意味着如果标签频率太高,标签无法匹配,那么TeeChart将分配“best fit”。改变标签角度和标签分隔是两个选项,可以帮助你适应你需要的标签。请参阅Labels和AxisLabels.Angle属性部分。
Label formats
您可以将所有标准的数字和日期格式应用于Axis标签。Axis页面的标签部分包含字段“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
多行标签
轴标签可以显示为多行文本,而不是单行文本。使用lines分隔符()分隔行。
例如:
[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 = True TChart1.Axes.Bottom.Labels.DateTimeFormat = "MM/dd hh:mm" TChart1.Axes.Bottom.Labels.MultiLine = True TChart1.Panel.MarginBottom = 10
设置AxisLabels.MultiLine属性为True将自动在有空格的行中拆分标签,有效地将标签分为两部分:
第一行用'mm/dd'
第二行是'hh:mm'
在运行时,你总是可以使用OnGetAxisLabel event以编程方式将标签分成几行:
[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 = myLabelText End Sub
在上面的例子中,"TeeSplitInLines"的全部过程将"LabelText"中的所有空格转换为行分隔符(返回)。
轴的AxisLabels.Angle属性也可用于多线轴标签。
定制Axis标签
通过使用Axis event可以获得进一步的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.Mark End Sub Private 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 If End Sub
有关使用Axis event自定义标签的更多信息,请参阅Axis event一节。
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"; //exponential format [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 With End Sub
标签将根据对数基数(默认为10)进行设置,因此,在本例中,将标签设置为1,10,100,1000,10000。
Ticks 和 Minor
有3种tick类型和2种Grid类型。你可以改变每个刻度和网格类型的长度、宽度和颜色。可以通过“tick”选项卡更改tick,其关联的网格和内部tick;可以通过“Minor”选项卡更改Minor Ticks及其相关网格。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 = 10 End With
轴的位置
轴有一个属性可以修改每个轴的位置。在这个例子中,轴移动了图表总宽度的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 = 50 End With
其他的轴
复制轴
TeeChart提供了与数据系列相关的5个轴:Left, Top, Bottom, Right和Depth。当您向图表添加新系列时,您可以定义该系列应与哪个轴相关(转到系列选项卡,常规页面)。您可以使用Axis Customdraw方法在图表的任何位置重复前面4个轴中的任何一个(或全部)。请注意,此方法会复制您的轴,但不会添加新的自定义轴。有关更多信息,请参阅下一节“多个自定义轴”。
例如:
[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 Sub Private 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 If End Sub
上面的示例代码将生成下面的图像:
自定义轴
在本例中,TeeChart将在图表的中心绘制新轴,一个水平轴和一个垂直轴。当您滚动图表(用鼠标右键拖动)时,新的垂直轴将始终保持在图表的中央,新的水平轴将随着垂直滚动上下移动。新轴是默认轴的精确副本。
多个自定义轴
加上PositionPercent和stretch属性,可以在图表的任何地方浮动无限的轴。滚动、缩放和轴命中检测也适用于自定义创建的轴。现在可以在设计时通过TeeChart编辑器和运行时通过几行代码创建额外的轴:
通过图表编辑器
TeeChart为您提供了在设计时创建自定义轴的能力,使它们能够以TeeChart的tee文件格式保存。要做到这一点,打开图表编辑器并单击轴选项卡,然后选择“+”按钮来添加自定义轴。然后选择位置选项卡,确保新的自定义轴高亮显示。此页面上的水平复选框允许您将新的自定义轴定义为水平轴或将其保留为默认垂直轴。该页的其余部分和轴页面中的其他选项卡可用于更改刻度,增量,标题,标签,刻度,小刻度和自定义轴的位置,如上所述。要将这个新的自定义轴与数据系列相关联,您需要选择Series选项卡,然后转到General页面,其中的下拉组合框“水平轴”和“垂直轴”将使您能够根据之前将其定义为垂直还是水平来选择新的自定义轴。
Via Code [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"; // You are able to then position the new Axis in overall relation to the Chart // by using the StartPosition and EndPosition properties. // // StartPosition=50 // EndPosition=100 // // These figures are expressed as percentages of the Chart Rectangle with 0 (zero) // (in the case of a vertical Axis) being Top. These properties can be applied to // the Standard Axes to create completely partitioned 'SubCharts' within the Chart. 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; [VB.Net] Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load Dim Line1 As New Steema.TeeChart.Styles.Line() Dim Line2 As New Steema.TeeChart.Styles.Line() Dim t As Integer TChart1.Aspect.View3D = False TChart1.Panel.Gradient.Visible = True TChart1.Header.Text = "TeeChart Multiple Axes" TChart1.Series.Add(Line1) TChart1.Series.Add(Line2) For t = 0 To 10 Line1.Add(t, 10 + t, Color.Red) If (t > 1) Then Line2.Add(t, t, Color.Green) End If Next With TChart1.Axes.Left .StartPosition = 0 .EndPosition = 50 .AxisPen.Color = Color.Red .Title.Font.Color = Color.Red .Title.Font.Bold = True .Title.Text = "1st Left Axis" End With 'You are able to then position the new Axis in overall relation to the Chart 'by using the StartPosition and EndPosition properties. ' StartPosition = 50 ' EndPosition = 100 'These figures are expressed as percentages of the Chart Rectangle with 0 (zero) '(in the case of a vertical Axis) being Top. These properties can be applied to 'the Standard Axes to create completely partitioned 'SubCharts' within the Chart. Dim Axis1 As New Steema.TeeChart.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 End Sub
上面的代码示例将显示以下图表:
Multiple axes
选择是无限的!建议在使用自定义轴时要谨慎,因为它很容易开始用新轴填充屏幕,并失去跟踪那个你希望处理的轴。
Axis events
Axis events提供了运行时灵活性,可以修改Axis标签,并在Axis单击上呈现用户交互性。
OnClickAxis
参见OnClickAxis event。
例如:
[C#.Net] private void tChart1_ClickAxis(object sender, System.Windows.Forms.MouseEventArgs e) if(((Steema.TeeChart.Axis)sender).Equals(tChart1.Axes.Bottom)) MessageBox.Show("Clicked Bottom Axis at: " + line1.XScreenToValue(e.X)); [VB.Net] Private Sub TChart1_ClickAxis(ByVal sender As Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles TChart1.ClickAxis If CType(sender, Steema.TeeChart.Axis) Is TChart1.Axes.Bottom Then MsgBox("Clicked Bottom Axis at: " & Line1.XScreenToValue(e.X)) End If End Sub
OnGetAxisLabel
可用于修改轴标签。参见OnGetAxisLabel event。
例如:
[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.Mark End Sub Private 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 If End Sub
OnGetNextAxisLabel
可用于决定应该显示哪些轴标签。参见OnGetNextAxisLabel事件。你应该使用e.Stop Boolean属性来包含/排除轴标签。
[C#.Net] private void Form1_Load(object sender, System.EventArgs e) line1.FillSampleValues(20); private void tChart1_GetNextAxisLabel(object sender, Steema.TeeChart.TChart.GetNextAxisLabelEventArgs e) if(((Steema.TeeChart.Axis)sender).Equals(tChart1.Axes.Bottom)) e.Stop = false; switch(e.LabelIndex) case 0: e.LabelValue = 5; break; case 1: e.LabelValue = 13; break; case 2: e.LabelValue = 19; break; default: e.Stop = true; break; [VB.Net] Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load Line1.FillSampleValues(20) End Sub Private Sub TChart1_GetNextAxisLabel(ByVal sender As Object, ByVal e As Steema.TeeChart.TChart.GetNextAxisLabelEventArgs) Handles TChart1.GetNextAxisLabel If CType(sender, Steema.TeeChart.Axis) Is TChart1.Axes.Bottom Then e.Stop = False Select Case e.LabelIndex Case 0 : e.LabelValue = 5 Case 1 : e.LabelValue = 13 Case 2 : e.LabelValue = 19 Case Else : e.Stop = True End Select End If End Sub
这就是本教程的全部内容!下一个教程 Legend 设置。