为轴创建偏移 - X和Y应满足0，而不是Y轴最小值

Question

我正在使用c3.js来显示温度值，作为我期望值从-30到+50度的范围。

到目前为止这个工作正常，但我对图形表示不满意。

我想让我的X轴在0处与Y轴相遇而不是在-30处。这可能与c3.js一起吗？我已经看过手册和示例，但我没有找到任何关于以这种方式抵消轴的信息。

Answer 1

您可以隐藏默认轴（1）并在零（2）处添加自定义行。

See in action（jsfiddle）

var chart = c3.generate({
    data: {
        columns: [
            ['sample', 30, 20, -10, 40, 15, -25]
        ]
    },
    axis: {
        x: {
            show: false // (1)
        },
        y: {
            max: 50,
            min: -30,
            // center: 0,
        }
    },
    grid: {
        y: {
            lines: [{ value: 0, text: 'zero' }] // (2)
        },
    },
});

相关文档：

1. http://c3js.org/reference.html#axis-x-show
2. http://c3js.org/reference.html#grid-y-lines