charts 相关问题

当从 websocket 收到日期时，我尝试使用 .update() 方法更新 Line Chart.js 的数据，但这不起作用，我无法解决问题。这是我的代码：当从 websocket 收到日期时，我尝试使用 .update() 方法更新 Line Chart.js 的数据，但这不起作用，我无法解决问题。这是我的代码： <!doctype html> <html> <head> <title>Line Chart</title> <script src="js/Chart.js"></script> <script type="text/javascript"> if ("WebSocket" in window) { var ws = new WebSocket("ws://localhost:8888/ws"); ws.onopen = function() { ws.send("data"); }; ws.onmessage = function(evt) { var received_msg = JSON.parse(evt.data) alert(received_msg[0]); alert(received_msg[1]); lineChartData.labels = received_msg[0]; lineChartData.datasets[0].data = received_msg[1]; lineChartData.update(); }; ws.onclose = function() { // websocket is closed. console.log("Connection is closed..."); }; } else { // The browser doesn't support WebSocket console.log("WebSocket NOT supported by your Browser!"); } </script> </head> <body> <div style="width:70%"> <div> <canvas id="canvas" height="450" width="800"></canvas> </div> </div> <script> var lineChartData = { labels: [], datasets: [{ label: "My Second dataset", fillColor: "rgba(151,187,205,0.2)", strokeColor: "rgba(151,187,205,1)", pointColor: "rgba(151,187,205,1)", pointStrokeColor: "#fff", pointHighlightFill: "#fff", pointHighlightStroke: "rgba(151,187,205,1)", data: [] }] } var options = { responsive: true, scaleShowGridLines: false, scaleLineColor: "rgba(0,0,0,.1)", } var ctx = document.getElementById("canvas").getContext("2d"); window.myLine = new Chart(ctx).Line(lineChartData, options); </script> </body> </html> 这是我想要更新图表的部分： ws.onmessage = function(evt) { var received_msg = JSON.parse(evt.data) alert(received_msg[0]); alert(received_msg[1]); lineChartData.labels = received_msg[0]; lineChartData.datasets[0].data = received_msg[1]; lineChartData.update(); }; 从警报输出中，我收到了格式良好的良好数据，但更新不起作用。你能帮我吗？问题是您正在更新数据“lineChartData”，但您想在图表上调用 update() 所以 ws.onmessage = function(evt) { var received_msg = JSON.parse(evt.data) alert(received_msg[0]); alert(received_msg[1]); lineChartData.labels = received_msg[0]; lineChartData.datasets[0].data = received_msg[1]; window.myLine.update(); //<-- magic }; 尝试将数据推入数组而不是重新分配它们例如 this.lineChartData.labels.push(received_msg[0]); this.lineChartData.datasets[0].data.push(received_msg[1]); window.myLine.update(); 或者如果它们是对象，您可以获取特定数据并将其推入数组中。如果你绘制的图表不是chart.js 例如，ccchart http://jsfiddle.net/UkdvS/602/ https://github.com/toshirot/ccchart var chartdata81 = { "config": { "title": "WebSocket Line Chart", "subTitle": "realtime", "bg": "#666", "type": "line", "xLines": [{ "useRow":1, "color":"rgba(250,250,250,0.7)" }] }, "data": [ ["year"], ["data1"], ["data2"] ] }; ccchart .init('hoge', chartdata81) .ws('ws://ccchart.com:8016') .on('message', ccchart.wscase.oneColAtATime); 此时的WebSocket数据格式如下： ["23:41:47",58,41] ["23:41:47",30,46] ["23:41:47",7,35] ["23:41:47",46,34] ["23:41:47",59,41] ["23:41:47",95,47] ["23:41:47",22,40] ["23:41:47",73,35] ・・・・・・・・・・・・ @see qiita.com/toshirot/items/a461cdc8c2079d9b8530　（日语）

javascript charts websocket chart.js

回答 3 投票 0

根据输入创建数据曲线

我正在尝试在图表上可视化一系列数据，理想情况下创建一些可以显示分布情况的东西。数据位于雪花数据库中，我尝试使用百分比来执行此操作...

charts snowflake-cloud-data-platform

回答 1 投票 0

基于 MSSQL 的条形图和折线图

我不熟悉ASP或PHP编写，我是数据库管理员，只能进行简单的代码更改。尝试找到任何可用/可行的复制/粘贴图形/图表示例以实现简单的可视化...

php sql-server asp-classic graph charts

回答 3 投票 0

可以从sql生成图表的Java库

我有weblogic，我可以在其中部署这个java应用程序和有数据的数据库。你能给我推荐一些免费的java库，它可以从我的数据生成图表吗？我找到了http://oreports...