Question

我使用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轴会在图表中显示而不是在图表下方。请看小提琴

http://jsfiddle.net/Lnhpwn8x/19/

Answer 1

我建议改用high / low，referenceValue和scaleMinSpace。这些都是不言自明的，low是轴上的最低值，high是最高值，referenceValue是始终显示的值。 scaleMinSpace是该轴上两条线之间的最小距离。

axisY : {
      low: 1.2,
      referenceValue: 3,
      scaleMinSpace: 40
        }

Fiddle example on the above.

但是，如果您只想缩放图表以显示所有数据，则可以指定scaleMinSpace，其余的将自动发生。 Fiddle example.

Chartist js图表显示不正确

1 个答案: