Chartjs动态选项设置不起作用

Question

我正在尝试动态设置 aspectRation，xAxes max和yAxes max 。当我将背景图像用于图表画布时，我希望 aspectRatio 为(width of the image/height of the image)。 xAxes max和yAxes max分别应为浏览器中画布的宽度和高度。但是在设置Chart.js选项之后，update()函数调用不会进行任何更改。而如果我很难对值进行编码，那么我将得到预期的结果。下面是代码片段：

loadGraph() {
    // getting static configuration for Chart.js
    this.configService.getConfig(this.configId)
       .then(
           (configData) => {
               // getting data list to plot on the chart
                this.chartDataService.getData(configData)
                    .subscribe(
                        (metrics) => {
                            this.scatterChart = new Chart('chartCanvas', configData);

                            // this returns the canvas height and width
                            const canvasDimension = this.getCanvasDimensions();
                            console.log(canvasDimension);

                            configData.options.aspectRatio = Number((this.backgroundImage.width / this.backgroundImage.height).toFixed(5));
                          configData.options.scales.xAxes[0].ticks.max = canvasDimension.w;
                          configData.options.scales.yAxes[0].ticks.max = canvasDimension.h;
                            console.log(configData);
                            this.scatterChart.update(); // <-- It is not working after the options change

                            metrics = this.organizeMetricByTime(metrics, canvasDimension.w, canvasDimension.h);
                            const timestampKeys = l.keys(metrics);
                            setTimeout(() => {
                                this.updateChart(this.scatterChart, configData, metrics, timestampKeys.shift(), timestampKeys)
                            }, this.INTERVAL);
                        },
                        (error) => {
                            console.log(error);
                        }
                    );
                }
            )
            .catch(
                (error) => {
                    console.log(error);
                }
            );
    }


updateChart(scatterChart, configData, metrics, ts, tsKeys) {
    if (tsKeys.length === 0) {
        return;
    }

    this.curTime = new Date(+ts);

    configData.data.datasets.forEach((dataset) => {
        dataset['data'] = l.find(metrics[ts], (o) => { return o.metricName === dataset.metricName; })['data'];
    });
    scatterChart.update();

    setTimeout(() => {
        this.updateChart(scatterChart, configData, metrics, tsKeys.shift(), tsKeys)
    }, this.INTERVAL);
}

请让我知道如何解决此问题。谢谢！