javascript - 使用 Chart.js 中的 addData() 方法向折线图添加数据

标签 javascript chart.js

抱歉,如果这不是提问的正确方式。我没有“声誉 50”来评论对相同问题的回答,礼仪规定我不应该“回答”问题。

我遇到了和描述的一样的问题 Add data to line chart using chart.js 但解决方案对我不起作用。 我正在运行较新版本的 Chart.js (1.0.1-beta.4),并且我已经按照建议尝试了旧版本 1.0.1-beta.3。 除了 addData() 之外,一切都对我有用。我已经注释掉了其他可行的方法。

顺便说一句,我不清楚 addData() 如何针对图表中的特定数据集。 文件说: 传递到 addData 的值数组应该是图表中每个数据集的值数组。
但是,我只使用了一个数据集。
下面是我尽可能简单的代码来演示我的问题。

我得到的错误是: 未捕获的类型错误:无法读取未定义的属性“点”
我使用的是 Linux Mint 17 和 Chrome 版本 39.0.2171.71(64 位)。

<!doctype html>
<html>
    <head>
        <title>Line Chart</title>
        <script src="/js/Chart.min.js"></script>
        <script>
            window.onload = function() {
                var ctx = document.getElementById("canvas").getContext("2d");

                var lineChartData = {
                    labels : ["1","2","3"],
                    datasets : [
                        {
                            label: "Pulse",
                            data: [ 50, 60, 70 ],
                        },
                    ]
                };

                var myLineChart = new Chart(ctx).Line( lineChartData, {} ) ;

                // myLineChart.datasets[0].points[2].value = 100 ; // works
                // myLineChart.update();       // works - resizes for y=100
                // myLineChart.removeData() ;  // works

                myLineChart.addData( [4,80], "4");    // doesn't work
            }
        </script>
    </head>
    <body>
        <div style="width:30%">
            <div>
                <canvas id="canvas" height="150" width="400"></canvas>
            </div>
        </div>
    </body>
</html>

最佳答案

好的,我知道出了什么问题。
我误解了如何使用 addData()。 我认为提供的数组是一组 x、y 坐标,但它是一组 y 坐标,每个数据集 1 个,下一个“标签”参数是“x”标签。
我要关闭它。
抱歉浪费大家的时间。

关于javascript - 使用 Chart.js 中的 addData() 方法向折线图添加数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27633089/

相关文章:

javascript - Node.js 同步读取文件作为字符串(不是缓冲区)

javascript - Vue watch 没有注意到组件属性的变化

javascript - 雷达 chartjs 上的渐变背景

javascript - 使用 jquery 在单击按钮时加载 html 文件时遇到困难

javascript - 异步队列,文件流结束如何知道两者何时完成

javascript - javascript参数背后的概念是什么?

javascript - WebKit 浏览器更新 Canvas 很慢

javascript - 如何在 Chart.js 中设置条形的默认颜色

javascript - 如何更改 Chart.js 中使用的插值器?

javascript - 如何使用chartJs中的折线图减小三 Angular 形的底部宽度?