Morris.js条形图 - 删除标签所在的多余空间

时间:2014-06-18 08:53:14

标签: jquery morris.js

我想显示一个没有标签的非常简单的条形图 - 我已经设法实现了这一点,但整个图表周围似乎有很多填充。我将我的图表设置为90px高度,但条形图仅为40px,整个图表周围似乎有大约25px的填充。

理想情况下,我想删除此填充 - 这是我删除的标签中的额外空间吗?

这是我的图表的图像:

enter image description here

这是我的jQuery:

function barChart() {
    window.m = Morris.Bar({
      // ID of the element in which to draw the chart.
      element: 'myfirstchart',
      axes: false,
      grid: false,
      hideHover: 'always',
      barColors: ['#00CDC6'],
      gridTextSize: 0,
      // Chart data records -- each entry in this array corresponds to a point on
      // the chart.
      data: [
    { visits: '01 June', value: 0 },
    { visits: '02 June', value: 1 },
    { visits: '03 June', value: 2 },
    { visits: '04 June', value: 3 },
    { visits: '05 June', value: 4 }
    //More data would be here               
      ],
      // The name of the data record attribute that contains x-values.
      xkey: 'visits',
      // A list of names of data record attributes that contain y-values.
      ykeys: ['value'],
      // Labels for the ykeys -- will be displayed when you hover over the
      // chart.
      labels: ['Value']
    });
}

有没有办法让X开始位置为0?

1 个答案:

答案 0 :(得分:2)

我知道这是旧的,但答案是简单地将填充设置为较小的尺寸......

padding: 1,

默认情况下,填充的外观为25px ......