Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/465.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何动态访问chart.js选项?_Javascript_Chart.js - Fatal编程技术网

Javascript 如何动态访问chart.js选项?

Javascript 如何动态访问chart.js选项?,javascript,chart.js,Javascript,Chart.js,我有一个chart.js chart对象myBarChart最初是用options对象创建的 options={ scaleOverride : true, scaleSteps : ymax, scaleStepWidth : 1, scaleStartValue : 0, ... } 其中,ymax被计算为“建议最大” 用户通过单击图表的条形图向图表中添加数据;update函数按如下方式访问数据: myBarChart.datasets[0].b

我有一个chart.js chart对象
myBarChart
最初是用options对象创建的

options={
    scaleOverride : true,
    scaleSteps : ymax,
    scaleStepWidth : 1,
    scaleStartValue : 0, 

    ...
}
其中,
ymax
被计算为“建议最大”

用户通过单击图表的条形图向图表中添加数据;update函数按如下方式访问数据:

myBarChart.datasets[0].bars[i].value = newValue[i]
(在所有直方图箱上循环)。这个模式,连同,建议我应该能够访问选项作为

myBarChart.options.scaleSteps = newYmax;
myBarChart.update();
以便在用户添加数据时更改y轴的最大值。然而,这是行不通的。当用户添加足够的数据以超过原始的
ymax
时,会记录数据,但y轴从未改变,因此该条在顶部被切断

我尝试过设置显式值而不是
newYmax
,我看到了相同的行为,因此问题不在我对
newYmax
的计算中。我只是无法更改myBarChart.options.scaleSteps,我也不知道为什么

我使用的是v1.0.1(升级不是一个选项)。表示创建后无法更改选项,并且必须重新绘制图表,但我找不到任何文档支持此操作


创建图表后,我可以访问并更改chart.js选项吗?

要更新选项,可以更新单个属性,也可以更新整个对象。然后,必须在图表上强制重画以使新的图表选项生效(请参阅)

例如:

const ctx = document.getElementById("myChart").getContext('2d');
const chart = new ChartJS(ctx, { title: { text: 'old title' } });
chart.options.title.text = 'new title';
chart.update();

这是我正在做的,但不起作用。我编辑了我的问题,以澄清我正在使用
update()
函数。图表轴仍然不更新。对,向下滚动文档,它会提到如何更新比例。另外,确保scaleSteps是配置对象中的有效属性。可能是scaleSteps的初始setter不正确,导致ChartJS使用默认行为覆盖属性。因此,如果它不正确,您将无法更新相同的属性。
//get object
const chartJS: Chart = $("#myChart").data('chart');

//change something
chartJS.config.options.scales.yAxes[0].ticks.min = minVal <= 0 ? minVal : minVal - 

//update
chartJS.update();
....
var ctx = canvas.getContext("2d");
var myChart = new Chart(ctx, {
                type: 'line',
                data: chartData,
                options
            });

//
var canvasItem = $("#myChart");
canvasItem.data('chart', myChart);