基于 Vue 超级炫酷的可视化大屏模板

项目模板基于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 插件工具、中后台系统模板、动画库、低代码、可视化资源、开源项目、学习资源、特效源码等，如有其他优秀资源，欢迎发消息投稿，感谢点赞、转发、关注！！！

GitHub：https://github.com/bym110/vue-echarts

在线演示：https://bym110.github.io/vue-echarts/preview