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);

猜你喜欢

转载自www.cnblogs.com/sanduzxcvbnm/p/10431788.html