Chart.js 带 2 个 y 轴

Question

我试图让我的简单图表在两侧显示相同的 y 轴，如果不添加另一个图表，我似乎无法做到这一点。

是否可以仅使用 1 个图形来使其工作？

data: {
    labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
    datasets: [{
        label: 'My First dataset',
        data: [0, 10, 5, 2, 10, 15, 5],
        pointBorderWidth: 2,
        yAxisID: 'A'

    },{
        // This dataset appears on the second axis
        yAxisID: 'B',
    }]
},

// Configuration options go here
options: {
  scales: {
    xAxes: [{
        gridLines: {
            display:false
        }
    }],
    yAxes: [{
        id: 'B',
        position: 'right',
        gridLines: {
            zeroLineColor:'#131c2b'
        }   
    },{
        id: 'A',
        position: 'left',
        gridLines: {
            zeroLineColor:'#131c2b'
        }   
    },]
  }
}

Answer 1

我通过更新正确的 yAxis 最小值和最大值来使其工作。 现在它只在开始时更新，所以它没有响应。 每次更改图表时（例如，当您隐藏数据集时）都必须调用updateOptions() )...

这是我的代码（JSBin）

function updateOptions() {
  chart.options.scales.yAxes[1].ticks = {
    min: chart.scales.A.ticksAsNumbers[chart.scales.A.ticksAsNumbers.length-1],
    max: chart.scales.A.ticksAsNumbers[0]
  }
  chart.update()
}