我使用chartist.js创建图表,并使用FixedScaleAxis精确控制y轴上的点。
var data = {
labels: [ "1995",
"1996",
"1997",
"1998",
"1999",
"2000",
"2001",
"2002",
"2003",
"2004",
"2005",
"2006",
"2007",
"2008",
"2009",
"2010",
"2011",
"2012",
"2013",
"2014",
"2015"],
series: [
[ 2.92,
2.83,
2.69,
2.57,
2.4,
2.27,
2.19,
2.15,
2.06,
2.06,
1.92,
1.82,
1.8,
1.76,
1.72,
1.71,
1.61,
1.56,
1.52,
1.41,
1.35]
]
};
var options = {
height:400,
seriesBarDistance: 100,
axisY : {
type : Chartist.FixedScaleAxis,
ticks : [ 0, 0.3, 0.6, 0.9, 1.2, 1.5, 1.8, 2.1, 2.4, 2.7, 3.0 ]
}
};
new Chartist.Line('.ct-chart', data, options);
但是当我这样做并添加一个高度时,x轴会在图表中显示而不是在图表下方。请看小提琴
答案 0 :(得分:1)
我建议改用high
/ low
,referenceValue
和scaleMinSpace
。这些都是不言自明的,low
是轴上的最低值,high
是最高值,referenceValue
是始终显示的值。 scaleMinSpace
是该轴上两条线之间的最小距离。
axisY : {
low: 1.2,
referenceValue: 3,
scaleMinSpace: 40
}
但是,如果您只想缩放图表以显示所有数据,则可以指定scaleMinSpace
,其余的将自动发生。 Fiddle example.