图表的 Y 轴在 Billboard.js 中未正确重新呈现

Question

Billboard.js 中生成了一个图表，可以引入自定义值作为 Y 轴的最小值和最大值。

我遇到的问题是，修改值的时候连坐标轴都在变，跟引入的值不是很接近

例如这张截图：

关于最大值我觉得问题不大。但至少是这样。默认值为 0，引入 300 后我希望从更接近它的值开始，而不是像以前那样为 0。更改后 Y 轴仅移动了几个像素。

html代码：

<input type="number" ng-change="$ctrl.updateY('max')" ng-model="$ctrl.max">

JS代码：

updateY(val) {
    if(val=== 'max') {
        if(this.max || this.max === 0) {
            this.maxValue = this.max;
        }
    } else {
        if(this.min || this.min === 0) {
            this.minValue = this.min;
        }
    }
    const maxNumber = Number(this.maxValue);
    const minNumber = Number(this.minValue);
    this.lineView.chart.axis.range({max: {y: maxNumber}, min: {y: minNumber}});
    this.resetY = false;
}

这是 max 的代码，与 min 相同。

我认为问题可能来自 range，它没有生成带有引入值的 Y 轴。

有什么建议吗？

Answer 1

如果在 bb.generate 中添加填充，它会更接近引入的值：

const chart = bb.generate({
...
"axis": {
...
"y": {
...
        "padding" : {
        top: 0,
        bottom: 10
        }

...

图表的 Y 轴在 Billboard.js 中未正确重新呈现

Chart's Y-axis does not re-render properly in Billboard.js

javascript

charts

d3.js

billboard.js