一、项目需求

二、项目架构

三、项目源码分析

1、http服务器：Python Flask 框架；

http 代码

接口解析

2、文件监控：Python win32con 模块；

监控代码

代码解析

3、数据分析：Python Pandas 库；

Pandas Series代码

文件示例

4、数据可视化：Echarts + BootStrap 库；

BootStrap布局

Echarts图形代码

四、更多案例

一、项目需求

项目名称：【某智能工厂生产不良率分析大屏系统】。

项目需求：监测磁盘指定目录（含子目录）生产日志文件 变化，分析文件（Excel格式）统计数据，并展示到可视化大屏。

项目工期：5个工作日。

二、项目架构

运行环境支持Windows，Linux类系统。
B/S架构，支持Chrome，IE，QQ等主流浏览器。
http服务器：Python Flask 框架；
文件监控：Python win32con 模块；
数据分析：Python Pandas 库；
数据可视化：Echarts + BootStrap 库；

三、项目源码分析

1、http服务器：Python Flask 框架；

http 代码

from flask import Flask#此处省略其他代码
#...@app.route('/datas/<flag>', methods=['GET', 'POST'])
def datas(flag):data = get_monitor(flag).get_result()return {"id": flag,"msg": "success","data": data}if __name__ == '__main__':# 开启 flask 服务app.run(host='0.0.0.0', port=8080, debug=True)

接口解析

前端调用接口： datas

参数flag：监测的目录路径

数据请求方式：GET或POST

数据响应：JSON

2、文件监控：Python win32con 模块；

监控代码

hDir = win32file.CreateFile(self.path_to_watch,FILE_LIST_DIRECTORY,win32con.FILE_SHARE_READ | win32con.FILE_SHARE_WRITE,None,win32con.OPEN_EXISTING,win32con.FILE_FLAG_BACKUP_SEMANTICS,None)
while 1:results = win32file.ReadDirectoryChangesW(hDir,1024,True,win32con.FILE_NOTIFY_CHANGE_FILE_NAME |win32con.FILE_NOTIFY_CHANGE_DIR_NAME |win32con.FILE_NOTIFY_CHANGE_ATTRIBUTES |win32con.FILE_NOTIFY_CHANGE_SIZE |win32con.FILE_NOTIFY_CHANGE_LAST_WRITE |win32con.FILE_NOTIFY_CHANGE_SECURITY,None,None)for action, filename in results:full_filename = os.path.join(self.path_to_watch, filename)# 响应事件处理，开始分析统计# 。。。

代码解析

win32file.CreateFile 监控目录 path_to_watch。

win32file.ReadDirectoryChangesW 响应目录及子目录文件变化通知。

3、数据分析：Python Pandas 库；

Pandas Series代码

# 统计关键字出现次数总和df = pd.read_csv(file, encoding="gb2312")
return df['测量项目名称'].value_counts()

# 合并数据
series_total = series_total + series_config# 删除nan
series_total = series_total.dropna()

文件示例

4、数据可视化：Echarts + BootStrap 库；

BootStrap布局

<div class="container_fluid"><!-- 标题栏 --><div class="row_fluid"><div id="container_1" class="col-xs-12 col-md-12"></div></div><!-- 上栏 --><div class="row_fluid"><!-- 上左栏 --><div id="container_2" class="col-xs-12 col-md-4"><div id="container_2_1" class="col-xs-12 col-md-6"></div><div id="container_2_2" class="col-xs-12 col-md-6"></div><div id="container_2_3" class="col-xs-12 col-md-12"></div></div><!-- 上中栏 --><div id="container_3" class="col-xs-12 col-md-4"><iframe src="myimg/video.mp4" scrolling="no" border=0 frameborder="no" framespacing=0allowfullscreen="true" width="100%" height="100%"> </iframe></div><!-- 上右栏 --><div id="container_4" class="col-xs-12 col-md-4"><div id="container_4_1" class="col-xs-12 col-md-3"></div><div id="container_4_2" class="col-xs-12 col-md-3"></div><div id="container_4_3" class="col-xs-12 col-md-3"></div><div id="container_4_4" class="col-xs-12 col-md-3"></div><div id="container_4_5" class="col-xs-12 col-md-6"></div><div id="container_4_6" class="col-xs-12 col-md-6"></div></div></div></div><!-- 下栏 --><div class="row_fluid"><!-- 下左栏 --><div id="container_5" class="col-xs-12 col-md-4"><div id="container_5_1" class="col-xs-12 col-md-12"></div><div id="container_5_2" class="col-xs-12 col-md-12"></div></div><!-- 下中栏 --><div id="container_6" class="col-xs-12 col-md-4"></div><!-- 下右栏 --><div class="col-xs-12 col-md-4"><div id="container_7" class="row_fluid"><div id="container_7_1" class="col-xs-12 col-md-6"></div><div id="container_7_2" class="col-xs-12 col-md-6"></div><div id="container_7_3" class="col-xs-12 col-md-12"></div></div></div></div>

Echarts图形代码

var idContainer_4_5 = "container_4_5";
function initEchart_4_5() {// 基于准备好的dom，初始化echarts实例var myChart = echarts.init(document.getElementById(idContainer_4_5), gTheme);option = {title: {text: "年龄分布",top: "10%",left: "center",textStyle: {color: "#17c0ff",fontSize: "12",},},tooltip: {trigger: "item",formatter: "{a} <br/>{b}: {c} ({d}%)",position: function (p) {//其中p为当前鼠标的位置return [p[0] + 10, p[1] - 10];},},grid: {left: "0",right: "10",bottom: "25%",top: "20%",containLabel: true,},xAxis: {type: "category",data: [],axisLabel: {textStyle: {color: "rgba(255,255,255,.8)",fontSize: 10,},},axisLine: {lineStyle: {color: "rgba(255,255,255,.2)",},},splitLine: {lineStyle: {color: "rgba(255,255,255,.1)",},},},yAxis: {type: "value",data: [],axisLabel: {textStyle: {color: "rgba(255,255,255,.8)",fontSize: 10,},},axisLine: {lineStyle: {color: "rgba(255,255,255,.2)",},},splitLine: {lineStyle: {color: "rgba(255,255,255,.1)",},},},series: [{name: "年龄分布",type: "bar",stack: "total",label: {show: true,},},],};// 使用刚指定的配置项和数据显示图表。myChart.setOption(option);window.addEventListener("resize", function () {myChart.resize();});
}function getKeys(dataList) {var keys = [];var len = dataList.length;for (var i = 0; i < len; i++) keys.push(dataList[i].name);return keys;
}function asyncData_4_5() {$.getJSON("myjson/bar_age.json").done(function (data) {var myChart = echarts.init(document.getElementById(idContainer_4_5));myChart.setOption({xAxis: { data: getKeys(data) },series: [{ data: data }],});}); //end $.getJSON
}initEchart_4_5();

四、更多案例

YYDatav的数据可视化《精彩案例汇总》_YYDataV的博客-CSDN博客❤️数据可视化❤️：基于 Echarts + Vue 实现的大屏范例【14】_小魔怪的博客-CSDN博客_echarts数据可视化❤️数据可视化❤️：基于 Echarts + Python 实现的大屏范例【13】国庆黄金周旅游监测㙍㙍㙍来了~_小魔怪的博客-CSDN博客❤️数据可视化❤️：基于 Echarts + Python 实现的大屏范例【12】（你想要的酷炫世界地图在这里了！）_小魔怪的博客-CSDN博客数据可视化：基于 Echarts + Python 实现的动态实时大屏范例【十一】https://yydatav.blog.csdn.net/article/details/120705616本次分享结束，欢迎多多交流，商务合作请私聊。

【定制项目】【M13】【数据监控 + 数据分析 + 可视化大屏】- 关键技术 python flask + pandas + echarts + excel相关推荐

地方旅游产业运行监测与应急指挥平台/旅游资源管理平台/旅游产业监测平台/旅游应急指挥平台/旅游资源统计/旅游线路数据/旅游产业可视化大屏管理系统/餐饮场所数据/游客流量监测/景区数据监测/视频监控
作品介绍:地方旅游产业运行监测与应急指挥平台/旅游资源管理平台/旅游产业监测平台/旅游应急指挥平台/旅游资源统计/旅游线路数据/旅游产业可视化大屏管理系统/餐饮场所数据/游客流量监测/景区数据监测/视 ...
拼接大屏数据展示_可视化大屏的UI设计是根据哪几个方面来进行？
随着大数据产业的发展,越来越多的公司开始意识到数据资源的管理和运用,特别是一些中.大型企业,在日常中会经常用到可视化大屏,这个时候就需要UI设计师能呈现出相应的视觉效果.下面,就给大家介绍一下可视化大 ...
【定制项目】【M14 监测预警平台】百度地图区域绘制(时间轴）/柱状图/仪表图 - 关键技术 python flask + echarts
一.项目需求项目名称:[某监测预警平台]. 项目需求:气候数据:雨量,温湿度,PM,雷达回波,雷电预报等展示到可视化大屏. 项目工期:10个工作日. 二.项目架构运行环境支持Windows,Lin ...
数据分析可视化大屏通用模板（一）
1.此模板采用js+css+html编写,可用于数据分析.数字大屏.数字可视化. 2.编写简单,小白可用,下载后直接打开index.html文件即可查看. 3.效果查看请访问:大数据通用模板一 - 博 ...
elementui的tree组件页面显示不出数据_只要10分钟，教你配置出炫酷的数据可视化大屏...
在电影<摩天营救>中,监控中心的全方位展示屏幕给人印象深刻.现在这种立体化大屏幕似乎成了好莱坞大片的标配.其实,这种逼格很高的镜头就是一个数据可视化大屏.随着社会信息化的高速增长,数据可视 ...
炫酷大屏demo_只要10分钟，教你配置出炫酷的数据可视化大屏
在电影<摩天营救>中,监控中心的全方位展示屏幕给人印象深刻.现在这种立体化大屏幕似乎成了好莱坞大片的标配.其实,这种逼格很高的镜头就是一个数据可视化大屏. 随着社会信息化的高速增长,数据可 ...
数据可视化大屏应用场景有哪些？
可视化大屏是什么? 数据可视化是通过图形手段清晰有效地传达和交流信息.简而言之,就是通过图形设计来表示枯燥的数据,从而实现更准确.更高效的数据分析和表达.一方面可以使数据的呈现更加直观,方便用户查看: ...
100+套Axure数据可视化大屏展示原型模板
内置多种实用美观的可视化组件库及行业模板库,行业模板涵盖:金融.教育.医疗.政府.交通.制造等多个行业,提供设计参考. 随着大数据的发展,可视化大屏在各行各业得到越来越广泛的应用.可视化大屏不再只是电 ...
可视化大屏设计尺寸_数据可视化怎么确定大屏的设计尺寸？
谢邀,我们设计的可视化大屏通常可以分为两类:一类是拼接屏,由46-55寸的液晶显示屏拼接而成,有一定的缝隙: 一类是LED屏无缝隙,是由成千上万个LED灯构成像素点,发光像素点之间的距离是LED显示屏 ...
整理全网最全大屏，可视化大屏，可视化方案，可视化参考，报表，大屏设计，大屏资源，大屏学习，高保真大屏
整理全网最全大屏设计资源,包括各类智慧大屏,axure高保真大屏原型,大屏设计参考思路,大屏设计可视化图片,如何学习设计大屏等. Gitee仓库地址:https://gitee.com/AiShiYu ...

【定制项目】【M13】【数据监控 + 数据分析 + 可视化大屏】- 关键技术 python flask + pandas + echarts + excel

一、项目需求

二、项目架构

三、项目源码分析

1、http服务器：Python Flask 框架；

http 代码

接口解析

2、文件监控：Python win32con 模块；

监控代码

代码解析

3、数据分析：Python Pandas 库；

Pandas Series代码

文件示例

4、数据可视化：Echarts + BootStrap 库；

BootStrap布局

Echarts图形代码

四、更多案例

【定制项目】【M13】【数据监控 + 数据分析 + 可视化大屏】- 关键技术 python flask + pandas + echarts + excel相关推荐

最新文章

热门文章