动态更新 Highcharts 数据的实现方法
<! Doctype html> <html> <head> <script type = "text/javascript" src = "http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"> </script> <script type = "text/javascript" src = "http://cdn.hcharts.cn/highcharts/highcharts.js"> </script> <script type = "text/javascript"> var chart; $ (function () {chart = new HighTharts.chart ({chart: {renderto: 'intainer'}, заголовок: {text: '? function show () {var trs = $ ('table tr'); var DataS = []; var map = {}; for (var i = 1; i <trs.length; i ++) {var nams = $ ('td: First', trs [i]). html (); var value = $ ('td: last', trs [i]). html (); if (typeof map [nams] == 'undefined') {var pos = datas.length; карта [NAMS] = POS; data [pos] = {name: nams, data: []}; } dataS [map [nams]] ["data"]. push (number (value)); } var series = chart.series; if (series.length> 0) {series [0] .remove (false); } var d = dataS [0]; chart.addseries (d); // 设置数据, danielinbiti chart.settitle ({text: d.name}); // 设置标题 Похвала Danielinbiti chart.redraw (); } </script> <script type = "text/javascript"> $ (function () {new Highcharts.chart ({chart: {renderto: 'container2'}, название: {text: '链球菌毒素 O',}, xaxis: {категории: []}, yAxis: {{{{数据 '}, stemy: 'Sbaso', данные: [7.0, 6.9, 9,5, 14,5, 18,2, 21,5, 25,2, 26,5, 23,3, 18,3, 13,9, 9,6]}]}); </script> </head> <body> <input type='button' onclick='show()' value='显示表格数据'/> <h1>曲线图</h1> <!-- 第一个空图 --> <div id="container"></div> <!-- 第二个有数据的图 --> <div id="container2"></div> <table align="left"> <tr> <td>CName</td> <Td> ename </td> <td> time </td> <td> date </td> </tr> <tr> <td> 血小板 </td> <td> hplt </td> <td> 1 </td> <td> 7,0 </td> </tr> <tr> <td> 血小板 td> <td> <td> <td> <td> <td> <td> <td> <td> <td> <td> 2 </td> <td> 6.9 </td> </tr> <tr> <td> 血小板 </td> <td> hplt </td> <td> 3 </td> <td> 9,5 </td> </tr> </table> </body> </html>以上这篇动态更新 Highcharts 数据的实现方法就是小编分享给大家的全部内容了 希望能给大家一个参考 , 也希望大家多多支持武林网。 也希望大家多多支持武林网。 也希望大家多多支持武林网。