30款开源的可视化大屏免费下载
来源 | 法纳斯特
大屏数据可视化是以大屏为主要展示载体的数据可视化设计。
“大面积、炫酷动效、丰富色彩”,大屏易在观感上给人留下震撼印象,便于营造某些独特氛围、打造仪式感。
原本看不见的数据可视化后,便能调动人的情绪、引发人的共鸣。
大屏数据可视化目前主要有信息展示、数据分析及监控预警三大类。
今天小F就给大家分享30款开源的可视化大屏(含源码),可以多多学习。
![](https://filescdn.proginn.com/756a361439438e76e700cedd1a3da780/7d6a8db3ff1bf562e1f2bf2a13b60d64.webp)
下载到本地后,直接运行文件夹中的index.html,即可看到大屏。
01 数据可视化页面设计
![](https://filescdn.proginn.com/b4fd580ac4946f90bd5d9815d34542d8/78de934b5b4f8d01ebd534ca0f1a4119.webp)
有动画效果,显得高大上!
主要图表:柱状图、水球图、折线图等。
02 数据可视化演示系统
![](https://filescdn.proginn.com/5d0a7f093f5271f5a1cd461b7d17b7ca/93a13fa66b7fd86e2489248ee7298327.webp)
不仅有动画效果,还有科技感光效。
主要图表:柱状图、折线图、饼图、地图等。
03 服务大数据可视化监管平台
![](https://filescdn.proginn.com/6caae091287d86e126a09641865bc641/31ab115170bf9b7d2e49ad6fbd2a08e4.webp)
主要图表:树形面积图、柱状图、环形图、雷达图等。
04 智能看板
![](https://filescdn.proginn.com/69ad1fd5962ca98c52370e5155ee2b1e/58375eb19b647173e7dccac1c4ccf650.webp)
左侧有个滑动的信息流列表,中间有个飞线图。
动态效果,让整体看起来更加引人注目。
主要图表:地图、曲线图,饼图、柱状图等。
05 翼兴消防监控
![](https://filescdn.proginn.com/6a9c18242314a086cf5e41f01c3eae07/98d10be373fd6a08482af53d8e091f05.webp)
消防数据监控,有两个可旋转的3D柱状图。
主要图表:柱状图、气泡图、仪表盘图、折线图等。
06 南方软件视频平台大屏中心
![](https://filescdn.proginn.com/f9601161423a097592cb47d4af2a57ec/b871e35ab03d5de234724a207e81c694.webp)
中间的柱状图添加了渐变颜色,显得很有立体感!
主要图表:柱状图、散点图等。
07 数据可视化大屏展示系统
![](https://filescdn.proginn.com/f29e1701047469bc24f6c38c2955a957/e280ffe1a06afdc2a9a8ef1731190315.webp)
左侧的光效设计的不错,使得画面饱满,立体感强。
突出主要视觉,吸引目光。
08 全国图书零售监测数据
![](https://filescdn.proginn.com/c66e169f1e8cfc210ab9021ef0f3b3d4/10ea860e10342c1af09d13e02a1934ab.webp)
主要图表:地图、环形图、柱状图、折线图等。
09 晋城高速综合管控大数据
![](https://filescdn.proginn.com/f5f10ea4fd6e697bf2a8ba5b1cabd5ec/a579c2fcc4d5c9e26092b47fe90f3227.webp)
一个出行服务的交通大数据平台(智慧交通)。
主要图表:柱状图、折线图、曲线面积图、地图、雷达图、环形图等。
10 无线网络大数据平台
![](https://filescdn.proginn.com/1806b73b9bf4866ba799d4c1a16468cc/986c3e03acd91a9152853e45c75c5118.webp)
较如今的设计,算是比较老旧的。
主要图表:柱状图、环形图、折线图、地图等。
11 Echart图例使用
![](https://filescdn.proginn.com/47b085d597bd2883ec9de8fc87007e8e/e7c2835f4644912a02d194ae23880fe5.webp)
Echarts是一个使用JavaScript实现的开源可视化库,涵盖各行业图表,满足各种需求。
主要图表:雷达图、地图、饼图、柱状图等。
12 发稿数据可视化大屏
![](https://filescdn.proginn.com/f3afee895c001c3efef0815a60b2b254/7972078e606c66cd8471d433920a65c0.webp)
主要图表:柱状图、折线图、饼图等。
13 大数据可视化平台
![](https://filescdn.proginn.com/3778405ca55448e8c795abcb4e2a279d/0273f6076813ec6df4a40d95036bd5b2.webp)
挺常见的一个大屏模版。
主要图表:环形图、气泡图等。
14 设备大数据
![](https://filescdn.proginn.com/6e8aade1b970555f3fbf1741c45bd30c/b2f5ad0acd1de66ba4c4bd4d1d674aa4.webp)
这个大屏就简单一些,信息不是很多。
主要图表:饼图、柱状图、折线图等。
15 游戏数据大屏
![](https://filescdn.proginn.com/da87a92c31884e70c2362c9fcbd879ba/c1ded8a13e4d84cb93463a7286b06dc4.webp)
一个游戏运营数据看板。
主要图表:柱状图、曲线图等。
16 厅店营业效能分析
![](https://filescdn.proginn.com/408d19b0a6cb8d66aa7f3d9a4216594d/5b9506097f101c9967d9f03ed3616b20.webp)
手机营业厅日常数据展示。
主要图表:曲线图、柱状图等。
17 车辆综合管控平台
![](https://filescdn.proginn.com/ce0f866548f6b5e963b14483568db65d/9406c1f1edc4a2721d8ee07baf09ac3d.webp)
车辆数据分析平台,中间也是动画效果,没录GIF动图。
主要图表:柱状图、环形图、折线图等。
18 保税区A仓数据
![](https://filescdn.proginn.com/a50d450730368b14c398eacbbdf46ab0/a7a3ac3a32b0f4553cbe0e1d69b599cc.webp)
一个较为简约的大屏。
主要图表:曲线面积图、环形图、柱状图(可滑动)等。
19 政务大数据共享交换平台
![](https://filescdn.proginn.com/00e853913f55d2d78c722f84e6ee42ba/c8eb8bd454210067e7cb03bd126a3e06.webp)
主要图表:饼图、曲线图、柱状图等。
20 兰州智慧消防大数据平台
![](https://filescdn.proginn.com/e086ed6b352610afcfd601f59d956ad3/0cdc5c221c9182c6d1bdfa434b25c9cc.webp)
主要图表:折线面积图、柱状图等。
21 大数据可视化系统数据分析通用模版
![](https://filescdn.proginn.com/26aab98eb38632dab9970862ff246a42/6010e163c690cf947698f4ce9a46d1f5.webp)
一个大屏通用模版。
主要图表:条形图、柱状图、曲线图、环形图等。
22 大数据展示模版
![](https://filescdn.proginn.com/b96d20a6dd780b165fe8d8fccc871c93/b735774cef3e87cc5892390426b3f81a.webp)
同样是一个可视化大屏模版。
主要图表:地图、柱状图、条形图、曲线面积图、雷达图。
23 大数据可视化系统数据分析通用模版
![](https://filescdn.proginn.com/f250d847a5db0d78282875d93e464532/b92029afc39b2155c87ab52c22b02c69.webp)
主要图表:条形图、曲线面积图、雷达图等。
24 智慧社区
![](https://filescdn.proginn.com/c2b61f0ede63cf69bdd1c4cc786b0e6b/b3711050982b5c6184a4e1c2db56be0c.webp)
![](https://filescdn.proginn.com/9778438a76b9dcf1f02bffdfe27aa12b/f993c62d6b51fcb9584d9c2a1c0ef209.webp)
一个智慧小区的可视化大屏。
主要图表:柱状图、曲线面积图、饼图等。
25 运营商服务器监控
![](https://filescdn.proginn.com/792552b86ecc8f8bc21b2bed41ff4e1e/57db96f326f38eb4773ffb291b4d2262.webp)
一个服务器监控大屏,了解服务器的运行情况。
主要图表:条形图、仪表盘图、雷达图、水球图等。
26 酒机运行状态
![](https://filescdn.proginn.com/92ec8f23b44b1a8ee8994dd450356fe6/b5357753534b997472f6cdf573889ae6.webp)
主要图表:仪表盘图、饼图、柱状图等。
27 医疗督导平台
![](https://filescdn.proginn.com/7d68f3f2a2fb1872adf50dc938818da1/a58a93099b5a8bcaf347a8d627df7cad.webp)
这个在疫情期间,应该是非常有用的。
主要图表:环形图、柱状图等。
28 物流云数据看板平台
![](https://filescdn.proginn.com/a3fc2347096e58d55cda601b46d18ed9/8064051c1d6fb535f24fadb614bbe3b3.webp)
![](https://filescdn.proginn.com/269dc0461641a9b1a80c081c05d29cc9/3946a3089d5dbbcc5fddd3ef05f25bce.webp)
物流信息看板,点击左上角「物流汇总看板」按钮,可以看到汇总信息。
主要图表:柱状图、环形图、面积图等。
29 大数据可视化平台(Vue.js)
![](https://filescdn.proginn.com/24a24d7a1185e062471ff24aa0fdae41/9a94e21bc3edcec4ec742a252285c3b9.webp)
上面的大部分大屏都是基于jquery,echarts编写的,最后提供两个Vue.js编写的可视化大屏。
需要安装npm环境,最后运行如下代码,即可显示。
npm install
npm run serve
主要图表:饼图、条形图、雷达图、折线图等。
30 风机可视化大屏
![](https://filescdn.proginn.com/025a5e8bc7b6dc0dc750c6517ece04ef/7a19eeb6f174aa4b6a124977e1e7dafb.webp)
一个3D风机可视化大屏,可以看到风机内部组件的运行情况。
主要图表:条形图、折线图等。
上述可视化大屏资源已打包,链接:https://pan.baidu.com/s/1wy7Dm5_Ae8wfC_-IYRaVmg 密码:rw4p
··· END ···