c3.js Y轴的最小/最大值无法正常工作

Question

c3.js Y轴的最小/最大值无法正常工作

10

我正尝试在c3.js中创建一个包含百分比的图表，但是y轴范围似乎出了问题。无论我做什么，最小/最大值似乎都会比我输入的值增加15。

下面包含的代码绘制的范围是0到约15。如果我将y的最大值设为10，它将开始上升到25。这真让人恼火。

    <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="/js/c3.js"></script>
<script>
  var chart = c3.generate({
    data: {
      columns: [
        ['PC', 0.038, 0.067],
        ['Tablet', 0.038, 0.056],
        ['Mobile',0.027,0.039]
      ],
      type: 'bar',
      labels: {
        format: {
            y: d3.format(".1%"),
        }}
    },
    axis: {
      x: {
        type: 'categorized',
        categories: ['Unique Click Rate','Total Click Rate']
      },
      y: {
        max: .1,
        min: 0
    }
    },
    bar: {
      width: {
        ratio: 0.5,

      },
    }
  });

  setTimeout(function () {
    chart.data.colors({PC: '#2C9AB7',Tablet: '#FEBE12', Mobile: '#DB3A1B'});
  }, 1000);

</script>

- neelshiv

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- neelshiv · Accepted Answer

发现轴有默认的填充值。这段代码修复了它。

      y: {
        max: .1,
        min: 0,
        padding: {top: 0, bottom: 0}
    }