Python使用Flask框架,結合Highchart,搭配數據功能模塊處理csv數據

參考連接:https://www.highcharts.com.cn/docs/data-modulesjavascript

1.javascript代碼css

var csv = document.getElementById('csv').innerHTML;
// $.get('data.csv', function(csv) {
var chart = Highcharts.chart('container', {
    chart: {
        type: 'column'
    },
    data: {
        csv: csv       // 指定 CSV 數據
    },
    title: {
        text: 'Fruit Consumption'
    },
    yAxis: {
        title: {
            text: 'Units'
        }
    }
});

2.html代碼html

<!-- 圖表容器 DOM -->
<div id="container"></div>
<pre id="csv">
    分類,蘋果,梨,橙子,香蕉
    小明,8,4,6,5
    小紅,3,4,2,3
    小張,8,7,7,7
    小芳,3,16,13,15
</pre>

3.css代碼java

#csv {
    display: none;
}

效果:ui

相關文章
相關標籤/搜索