分享几个超级炫酷的可视化大屏模板
项目模板基于vue、 echarts,包含世界地图、中国地图、人体脑图、折线图、柱状图、环形图、饼状图、雷达图等模块,可自行根据需求添加、删除模块。
数据修改:
将项目 /components 文件夹下 .vue 文件中模拟数据改为真实数据即可。setData(type) { // 数据模拟
let arr = [];
switch (type) {
case 'x': // 设置横坐标 时间数据
for (let i = 0; i < this.selectRangeDate.length; i++) {
arr.push(this.selectRangeDate[i][0] + '.' +
this.selectRangeDate[i][1] + '.' + this.selectRangeDate[i][2])
}
break;
case 's':// 访问次数数据模拟
for (let i = 0; i < this.selectRangeDate.length; i++) {
arr.push((Math.random() * 6).toFixed(0))
}
break;
case 'n': // 访问人数数据
for (let i = 0; i < this.selectRangeDate.length; i++) {
arr.push((Math.random() * 600).toFixed(0))
}
break;
}
return arr;
},
项目截图:
项目依赖:
"dependencies": {
"core-js": "^3.6.5",
"echarts": "^5.2.2",
"iview": "^3.1.3",
"vue": "^2.6.11",
"vue-router": "^3.2.0"
}
项目安装:
// 安装依赖
npm install
// 启动
npm run serve
《前端资源推荐》公众号收集各种前端组件 UI 框架、JS 插件工具、中后台系统模板、动画库、低代码、可视化资源、开源项目、学习资源、特效源码等,如有其他优秀资源,欢迎发消息投稿,感谢点赞、在看、转发、关注!!!
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· C#/.NET/.NET Core优秀项目和框架2025年2月简报
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 【杭电多校比赛记录】2025“钉耙编程”中国大学生算法设计春季联赛(1)
2021-02-27 python 雷达图 转载:https://mp.weixin.qq.com/s/M1f0ItGQz3BKZTIe1ootYQ
2018-02-27 airflow笔记