如何设置 highcharts X轴和Y轴值

 我来答
Tebro9
推荐于2016-12-01 · TA获得超过559个赞
知道小有建树答主
回答量:161
采纳率:100%
帮助的人:226万
展开全部

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(){
    return this.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。


详细请参考:http://www.hcharts.cn/docs/index.php?doc=basic-axis

推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式