我使用chartjs创建了一个基本条形图,它工作正常.现在我想基于时间间隔更新值.我的问题是,在创建图表后,我不知道如何正确更新其值...
我的代码:
var ctx = $("#myChart").get(0).getContext("2d");
var dts = [
{
fillColor: "rgba(220,220,220,0.5)",
strokeColor: "rgba(220,220,220,1)",
data: [0, 0, 0, 0, 0]
}
];
var data = {
labels: ["Core#1", "Core#2", "Core#3", "Core#4", "Total"],
datasets: dts
};
var chart = new Chart(ctx);
chart.Bar(data);
//test code
setInterval( function () {
data.datasets[0].data = [random(), random(), random(), random(), random()];
chart.Bar(data);
},2000);
在测试代码中,我正在更新值datasets[0].data- 这是正确的方法吗？这个问题是,每次调用时chart.Bar(),值都会重置为0然后设置为随机值(就像我正在重新创建图表一样).这样,所有动画总是从0到值,看起来很奇怪.我希望如果我将值从50更新为10,则条形图将从50下降到10并且不会设置为0然后动画为10.
我没有在文档中找到任何关于此的内容......我做错了什么或者这个库是不可能的？
我正在使用Chartjs来显示折线图,这很好用:
// get line chart canvas
var targetCanvas = document.getElementById('chartCanvas').getContext('2d');
// draw line chart
var chart = new Chart(targetCanvas).Line(chartData);
但是当我尝试更改图表的数据时会出现问题.我通过使用新数据点创建图表的新实例来更新图形,从而重新初始化画布.
这很好用.但是,当我将鼠标悬停在新图表上时,如果我碰巧检查了与旧图表上显示的点相对应的特定位置,则仍会触发悬停/标签,并且突然显示旧图表.当我的鼠标位于此位置时它仍然可见,并在离开该点时消失.我不希望显示旧图表.我想完全删除它.
在加载新画布之前,我试图清除画布和现有图表.喜欢:
targetCanvas.clearRect(0,0, targetCanvas.canvas.width, targetCanvas.canvas.height);
和
chart.clear();
但到目前为止,这些都没有奏效.关于如何阻止这种情况发生的任何想法？
我最近向折线图添加了放大和平移功能。现在我想添加一个重置按钮或类似的东西，当按下图形时，它会恢复到正常位置/形状。目前我正在绘制它的动态数据，每 10 秒更新一次。
先感谢您。
我有一个Chart.js的问题.
Firts,我设置了一个数据,然后当一个参数改变时,我想重新绑定整个图表.这项工作,但它的图表与旧数据仍然落后于新的数据.
第一 - >
chart.Line(data, options);
在一个事件 - >
chart.Line(newdata, options);
我看到这个解决方案 chart.js加载了全新的数据
但我不喜欢这样.我在一个有角度的指令背景下,所以它不是最好的方法.
我试过没有结果
.update(),. removeData(),. clear(),. destroy()等
这是我目前的指示
http://plnkr.co/edit/qn2UUyznonKm6zgEi8FW?p=catalogue
任何的想法 ？