logoCreated with Sketch.

F2Native

F2Axis

阅读时间约 2 分钟

坐标轴配置。F2Native 的坐标轴的组成如下:

术语英文
坐标轴文本label
坐标轴线line
坐标轴网格线grid

API

- axis

设置坐标轴配置；F2Native 的坐标轴组成如下

iOS

 chart.axis(@"date", @{ @"grid": @(NO) });
 chart.axis(@"value", @{
              @"line": @(NO),
              @"grid": @{
                @"type": @"dash",     
                @"lineWidth": @(1.0f), 
                @"stroke": @"#E6E6E6",
                @"lineDash": @[@(6),@(3)]
               },
              @"label": @{ @"textColor": @"#cccccc" ,@"textAlign":@"end",@"labelOffset":@(5)}
            });

Android

chart.setAxis("sales", new F2Chart.AxisConfigBuilder()
      .label(new F2Chart.AxisLabelConfigBuilder().labelOffset(5))
      .grid(new F2Chart.AxisGridConfigBuilder().type("dash"))
      .line(new F2Chart.AxisLineConfigBuilder().lineWidth(1).color("#E6E6E6").type("dash").lineDash(new double[]{6, 3}));
  • 参数
属性名类型解释
fieldString当前坐标轴所代表的数据在 source 中的名称
configDictionary坐标轴的具体配置信息 见下面 config
  • config
属性名类型解释
lineBool/Dictionaryfalse - 坐标轴线隐藏
配置见下面 line 定义
gridBool/Dictionaryfalse - 坐标轴网格线隐藏
配置见下面 grid 定义
labelBool/Dictionaryfalse - 坐标轴网格线隐藏
配置见下面 label 定义
  • line
属性名类型解释默认值
typeString线类型"line"/"dash"
colorString线颜色 （Hex rgba）"#999"
lineWidthfloat线宽度1.0f
  • grid
属性名类型解释默认值
typeString网格线类型
line- 直线
dash- 虚线		"line"
strokeString网格线颜色 （Hex rgba）"#999"
lineWidthfloat网格线宽度1.0f
lineDashArray<Number>虚线样式[2, 2]
  • label
属性名类型解释默认值
textColorString字体颜色 （Hex rgba）"#999"
textAlignString对齐方式"start"
lineDashArray<Number>虚线样式[2, 2]