Python使用Flask框架,结合Highchart处理jsonl数据
1.html代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>第一个 Highcharts 图表</title> <!-- 引入 jquery.js --> <script src="static/jquery-3.3.1.min.js"></script> <!-- 引入 highcharts.js --> <script src="static/highcharts-7.0.3.js"></script> <style> #data { display: none; } </style> </head> <body> <!-- 图表容器 DOM --> <div id="container"></div> <pre id="data"> [ [1,12], [2,5], [3,18], [4,13], [5,7], [6,4], [7,9], [8,10], [9,15], [10,22] ] </pre> <script src="static/b.js"></script> </body> </html>
2.js代码
var options = { chart: { renderTo: 'container', type: 'spline' }, series: [{}] }; var jsonStr = document.getElementById('data').innerHTML, jsonData = JSON.parse(jsonStr); options.series[0].data = jsonData; Highcharts.chart('container', options);