ComponentOne中文技术文档
Page tree
Skip to end of metadata
Go to start of metadata

大多数图表类型都绘制在两个轴之间，水平轴和垂直轴分别称为X轴和Y轴。通常使用X轴绘制类别，使用Y轴绘制值，但是在某些情况下（例如条形图），Y轴用作类别轴，而X轴用作值的轴。同样，根据数据，有时会将两个轴都用作值的轴。请注意，饼图，旭日特或树形图等图表是其中的一些例外，并且不具有任何轴。

在FlexChart中，两个轴由AxisX和  AxisY属性表示，  它们返回Axis类的对象  。除了将图表与数据源绑定之外，FlexChart还允许您将单个轴绑定到单独的数据源和字段，从而使您可以显示不同于图表数据源中可用轴的轴标签。 


CS
//Passing data to FlexChart's AxisY 
this.flexChart1.AxisY.DataSource = GetAxisBindinglabels();

//Setting which fields to bind to AxisY 
this.flexChart1.AxisY.Binding = "Value,Text";

请注意，上面的代码段使用自定义方法GetAxisBindinglabels为轴绑定提供数据。有关轴绑定的信息，请参见 轴绑定。

定位轴

默认情况下，FlexChart会在图表的底部渲染X轴，在图表的左侧渲染Y轴。但是，可以通过设置Position属性来将这些轴的位置更改为上，右，中心等，该 属性接受Position枚举中的值  。将此属性设置为 None将隐藏轴本身。


CS
      //在右侧显示Y轴，       
      this.flexChart1.AxisY.Position = Position.Right;

显示或隐藏轴线

默认情况下，FlexChart在X轴上显示轴线，但在Y轴上不显示轴线。要切换轴线的可见性，需要设置目标轴的  AxisLine属性。


CS
     //显示Y轴的轴线，默认情况下，
     this.flexChart1.AxisY.AxisLine = true;

设定轴范围

FlexChart还允许您分别使用Min和Max属性设置可以在轴上绘制的最小值和最大值。这可以帮助您通过仅绘制目标数据而不是将整个数据集弄乱图表图区域来分析数据的子集。


CS
   //Setting axis bounds    
   this.flexChart1.AxisY.Max = 150;
   this.flexChart1.AxisY.Min = 90;

显示反向轴

在某些情况下，翻转轴来从最大值到最小值的值显示有助于更好地呈现数据，例如各种瀑布的高度或不同高度的海洋深度。FlexChart允许您通过将Reversed属性设置为True来显示反向轴  。


CS
     //Flip the Y-axis to display minimum value on top and maximum towards origin      
     this.flexChart1.AxisY.Reversed = true;

显示多个轴

与默认的X轴和Y轴一起，FlexChart允许您在同一图表中显示多个轴。这使您可以处理值范围明显不同的多个系列。要将辅助轴添加到图表，您需要为具有不同数据值的系列添加新轴。


CS
//Creating and adding first Series to chart and binding it (AxisY) to 'HighTemp' field of Data 
var series1 = new Series()
{
    //Name property specifies the string to be displayed corresponding to this Series in Legend 
    Name = "Temperature(°C)",
    Binding = "HighTemp",

    //With more than one series setting ChartType (default:column) is mandatory 
    ChartType = ChartType.Column,

    //Adding axis to the series 
    AxisY = new Axis()
    {
        //Set where to show the AxisLine relative to PlotArea 
        Position = Position.Left,
        //Title property specifies the string to be displayed along AxisLine 
        Title = "Temperature (°C)",
        //Whether or not to show the AxisLine 
        AxisLine = true,
    }
};
this.flexChart1.Series.Add(series1);

//Creating and adding second Series to chart and binding it (AxisY) to 'Precipitation' field of Data 
var series2 = new Series()
{
    //Name property specifies the string to be displayed corresponding to this Series in Legend 
    Name = "Precipitation(mm)",
    Binding = "Precipitation",

    //With more than one series setting ChartType (default:column) is mandatory 
    ChartType = ChartType.LineSymbols,

    //Adding axis to the series 
    AxisY = new Axis()
    {
        //Set where to show the AxisLine relative to PlotArea 
        Position = Position.Right,
        //Title property specifies the string to be displayed along AxisLine 
        Title = "Precipitation (mm)",
        //Whether or not to show the AxisLine 
        AxisLine = true,
    },
};
this.flexChart1.Series.Add(series2);

轴样式

FlexChart允许您自定义轴线，并使图表看起来很吸引人，并与应用程序UI的其余部分保持同步。FlexChart 的Axis类提供了  Style属性，可以访问该属性来更改轴的笔触颜色，笔触宽度，线条图案等。



CS
//设置线条颜色
this.flexChart1.AxisX.Style.StrokeColor = Color.DarkBlue;
//设置线条宽度，
this.flexChart1.AxisX.Style.StrokeWidth = 1;
//设定要使用的图案
this.flexChart1.AxisX.Style.LinePattern = LinePatternEnum.DashDot;


除了上述功能外，FlexChart还提供了用于自定义轴元素的选项，例如标题，刻度线，单位等以及轴标签。您还可以对轴进行分组，以更好地进行分析和演示。以下各节详细讨论与轴和轴元素有关的这些功能。

轴元素

        讨论轴元素及其自定义。

轴标签

        讨论轴标签，其自定义以及处理重叠的选项。

轴分组

        讨论各种类型的轴分组：分类，数字和DateTime轴分组

  • No labels