使用Javascript动态更新chartjs中图表的选项 [英] Dynamically update the options of a chart in chartjs using Javascript

问题描述

我创建了一个能够在chartjs中成功更新数据的折线图，我也试图动态更改选项值。更具体地说，我希望能够改变比例。我想避免每次需要更新时重新创建图表。有没有办法动态更新选项，如：

I have created a line chart that is able to update its data successfully in chartjs and I am trying to change the option values dynamically as well. More specifically I want to be able to change the scale. I would like to avoid re-creating the chart everytime updates are needed. Is there a way to update the options dynamically such as :

myLiveChart.options.scaleStepWidth = 10;
myLiveChart.update();

注意：我也尝试了以下内容：

Note: I have tried the following as well :

myLiveChart.scaleStepWidth = 10;

还试过 myLiveChart.render（）; 而不是更新，但似乎没有什么真正起作用。

Also tried myLiveChart.render(); instead of update, but nothing seems to really work.

这里有一个说明问题的小提琴： http://jsbin.com/yaxafehixe/1/edit?html,js,output

here is a fiddle illustrating the problem: http://jsbin.com/yaxafehixe/1/edit?html,js,output

推荐答案

<我找到了一个解决方案，以防任何人谷歌这个。事情就是这样：我使用的是chartjs版本1，其中up​​date（）函数在所有情况下都不起作用，尤其是当您尝试更改图表的选项时。因此，切换到版本2，允许我正确使用update（）更改选项，例如：

I found a solution that works in case anybody googles this. Here is the thing : I was using chartjs version 1, in which the update() function doesn't work in all cases, especially when you are trying to change the options of a chart. Therefore, switching to version 2, allowed me to use update() properly with changing the options such as :

myChart.options.scales.yAxes[0].ticks.min = someValue;

如果有人遇到同样的问题，这是一个解决我的问题的方法： http://jsbin.com/bamemuliyu/3/edit?html,js,output

Here is a fiddle to demonstrate the solution to my problem in case anybody faces the same issue: http://jsbin.com/bamemuliyu/3/edit?html,js,output

这篇关于使用Javascript动态更新chartjs中图表的选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！