0

我正在使用 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/

4

1 回答 1

1

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

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

上面的小提琴示例。

但是,如果您只想让图表缩放以显示所有数据,您只需指定scaleMinSpace,其余的将自动发生。小提琴的例子。

于 2016-11-22T17:19:53.627 回答