Python使用Flask框架,结合Highchart,搭配数据功能模块处理csv数据
参考链接:https://www.highcharts.com.cn/docs/data-modules
1.javascript代码
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代码
<!-- 图表容器 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代码
#csv { display: none; }
效果:
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· 上周热点回顾(2.24-3.2)