highcharts属性

钟逸 61 2024-03-19 00:38:18

如何设置 highcharts X轴和Y轴值

highcharts所有的图表除了饼图都有X轴和Y轴,默认情况下,x轴显示在图表的底部,y轴显示在左侧(多个y轴时可以是显示在左右两侧),通过设置chart.inverted= true可以让x,y轴显示位置对调。

1、Axis Title

坐标轴标题。默认情况下,x轴为null(也就是没有title),y轴为'Value',设置坐标轴标题的代码如下:

xAxis:{

title:{

text:'x轴标题'

}

}

yAxis:{

title:{

text:'y轴标题'

}

}

2、Axis Labels

坐标轴标签(分类)。Labels常用属性有enabled、formatter、setp、staggerLines

1)enabled

是否启用Labels。x,y轴默认值都是true,如果想禁用(或不显示)Labels,设置该属性为false即可。

2)Formatter

标签格式化函数。默认实现是:

formatter:function(){

returnthis.value;

}

3)Step

Labels显示间隔,数据类型为number(或int)。

4)staggerLines

水平轴Lables显示行数。(该属性只对水平轴有效)当Lables内容过多时,可以通过该属性控制显示的行数。和该属性相关的还有maxStaggerLines属性。

3、Axis Tick

Tick为坐标轴刻度。默认情况下x轴刻度高(tickLength属性)为5px,宽为1px;y轴宽为0px(也就是不显示刻度)。Tick相关的属性主要有tickLength、tickWidth、tickColor、tickInterval、tickmarkPlacement。

1)tickLength、tickWidth、tickColor

分别代表刻度线的长度、宽度、颜色。

2)tickInterval

刻度间隔。其作用和Lables.step类似,就是不显示过多的x轴标签内容,不同的是,tickInterval是真正意义上的调整刻度,而Lables.step只是调整Labels显示间隔。所以在实际应用中,tickInterval用的多。

针对不同数据类型的坐标轴有不同的默认值。对于线性数据和Datetime类型数据,其默认值是tickPixelInterval值,对于Categorty表示间隔一个category。

3)tickmarkPlacement

刻度线对齐方式,有between和on可选,默认是between。

4、Axis gridLines

坐标轴网格线。默认情况下,x轴网格线宽度为0,y轴网格线宽度为1px。网格线共有三个属性可设置,分别是: gridLineWidth、gridLineColor、gridLineDashStyle

1)gridLineWidth

网格线宽度。x轴默认为0,y轴默认为1px。

2)gridLineColor

网格线颜色。默认为:#C0C0C0。

3)gridLineDashStyle

网格线线条样式。和Css border-style类似,常用的有:Solid、Dot、Dash。

详细请参考:

上一篇:手机qq飞车礼包免费领取礼包
下一篇:我的世界籽岷单人跑酷
相关文章
返回顶部小火箭