精华内容
下载资源
问答
  • vue大数据可视化(大屏展示)解决方案

    万次阅读 多人点赞 2020-04-21 14:09:10
    一个基于 vue、datav、Echart 框架的大数据可视化(大屏展示)模板,最近更新了详细的介绍说明,实现大数据可视化。通过 vue 组件实现数据动态刷新渲染,内部图表可自由替换。部分图表使用 DataV 自带组件,可自由...

    一个基于 vue、datav、Echart 框架的大数据可视化(大屏展示)模板,最近更新了详细的介绍说明,实现大数据可视化。通过 vue 组件实现数据动态刷新渲染,内部图表可自由替换。部分图表使用 DataV 自带组件,可自由进行更改,持续更新…

    项目地址: vue-big-screen(点击这里),去码云给个三连吧,求求大家惹(老B站了)
    在这里插入图片描述

    一、项目描述

    • React 版本请点击这里查看,全新界面超级好看!!!(o ゚ v ゚)ノ

    • 一个基于 vue、datav、Echart 框架的 " 数据大屏项目 ",通过 vue 组件实现数据动态刷新渲染,内部图表可实现自由替换。部分图表使用 DataV 自带组件,可进行更改,详情请点击下方 DataV 文档。

    • 项目需要全屏展示(按F11)。

    • 项目部分区域使用了全局注册方式,增加了打包体积,在实际运用中请使用按需引入。

    • 拉取项目之后,建议按照自己的功能区域重命名文件,现以简单的位置进行区分。

    • 项目环境:vue-cli-3.0、webpack-4.0、npm-6.13、node-v12.16。

    友情链接:

    1. DataV 官方文档(建议使用之前先浏览)
    2. echarts 实例echarts 官方文档
    3. Vue 官方文档
    4. 项目 gitee 地址(国内速度快)

    二、请大家点击上方的码云地方查看最新的代码与文档!

    希望代码没事🙏🙏🙏

    三、全新的 React 版本已经上线(超级好看)!!!

    1. react 可视化项目点击这里查看
      在这里插入图片描述
      觉得不错的话,两个项目就都去点个星星下⭐⭐⭐支持一下吧,谢谢啦。
    展开全文
  • 一、项目描述一个基于 vue、datav、Echart 框架的 " 数据大屏项目 ",通过 vue 组件实现数据动态刷新渲染,内部图表可实现自由替换。部分图表使用 DataV 自带组件,可进行更改,详情请点击下方 DataV 文档。项目需要...

    一、项目描述

    一个基于 vue、datav、Echart 框架的 " 数据大屏项目 ",通过 vue 组件实现数据动态刷新渲染,内部图表可实现自由替换。部分图表使用 DataV 自带组件,可进行更改,详情请点击下方 DataV 文档。

    项目需要全屏展示(按F11)。

    项目部分区域使用了全局注册方式,增加了打包体积,在实际运用中请使用按需引入。

    拉取项目之后,建议按照自己的功能区域重命名文件,现以简单的位置进行区分。

    项目环境:vue-cli-3.0、webpack-4.0、npm-6.13、node-v12.16。

    二、 主要文件介绍

    三、使用介绍

    如何请求数据

    现在的项目未使用前后端数据请求,建议使用 axios 进行数据请求,在 main.js 位置进行全局配置,在 views/xx.vue 文件里进行前后端数据请求。

    axios 的 main.js 配置参考范例(因人而异)

    在 vue 页面中调用 axios 方法并通过 props 传给 echarts 图表子组件

    如何动态渲染图表

    在components/echart下的文件,比如drawPie()是渲染函数,echartData是需要动态渲染的数据,当外界通过props传入新数据,我们可以使用watch()方法去监听,一但数据变化就调用this.drawPie()并触发内部的.setOption函数,重新渲染一次图表。

    如何更换边框

    边框是使用了 DataV 自带的组件,如:

    只需要去 views 目录下去寻找对应的位置去查找并替换就可以,具体的种类请去 DavaV 官网查看

    如何更换图表

    直接进入 components/echart 下的文件修改成你要的 echarts 模样,可以去echarts 官方社区里面查看案例。

    四、更新情况

    如果大家有意见请进行评论,小编也会尽力去更新。如还有其他关于数据可视化的疑问,可登录

    展开全文
  • 基于vue大数据可视化(大屏展示)案例

    千次阅读 多人点赞 2020-09-18 11:07:50
    1,一个基于 vue、datav、Echart 框架的 " 数据大屏项目 ",通过 vue 组件 实现数据动态刷新渲染,内部图表可实现自由替换。部分图表使用 DataV 自带组件,可进行更改,详情请点击下方 DataV 文档。 2,项目需要全屏...

    在这里插入图片描述
    项目地址: vue-big-screen 点击这里

    一、项目描述

    1,一个基于 vue、datav、Echart 框架的 " 数据大屏项目 ",通过 vue 组件

    实现数据动态刷新渲染,内部图表可实现自由替换。部分图表使用 DataV 自带组件,可进行更改,详情请点击下方 DataV 文档。

    2,项目需要全屏展示(按F11)。

    3,项目部分区域使用了全局注册方式,增加了打包体积,在实际运用中请使用按需引入。

    4,拉取项目之后,建议按照自己的功能区域重命名文件,现以简单的位置进行区分。

    5,项目环境:vue-cli-3.0、webpack-4.0、npm-6.13、node-v12.16。

    展开全文
  • 一、项目描述 一个基于 vue、datav、Echart 框架的 " 数据大屏项目 ",通过 vue 组件实现数据动态刷新渲染,内部图表可实现自由替换。部分图表使用 DataV 自带组件,可进行更改,详情请点击下方 DataV 文档。 项目...

    c78b80a19a722cd811e7bbead33c14c2.png

      一、项目描述

      一个基于 vue、datav、Echart 框架的 " 数据大屏项目 ",通过 vue 组件实现数据动态刷新渲染,内部图表可实现自由替换。部分图表使用 DataV 自带组件,可进行更改,详情请点击下方 DataV 文档。

      项目需要全屏展示(按F11)。

      项目部分区域使用了全局注册方式,增加了打包体积,在实际运用中请使用按需引入。

      拉取项目之后,建议按照自己的功能区域重命名文件,现以简单的位置进行区分。

      项目环境:vue-cli-3.0、webpack-4.0、npm-6.13、node-v12.16。

      二、 主要文件介绍

    5267b15325cfb40d3c696017aeb86472.png

      三、使用介绍

      如何请求数据

      现在的项目未使用前后端数据请求,建议使用 axios 进行数据请求,在 main.js 位置进行全局配置,在 views/xx.vue 文件里进行前后端数据请求。

      axios 的 main.js 配置参考范例(因人而异)

    98efbf1ef52d3f4b5c91a4ec0114fe14.png

      在 vue 页面中调用 axios 方法并通过 props 传给 echarts 图表子组件

    20dd7a9f33032c9798356c89079b11f3.png

      如何动态渲染图表

      在components/echart下的文件,比如drawPie()是渲染函数,echartData是需要动态渲染的数据,当外界通过props传入新数据,我们可以使用watch()方法去监听,一但数据变化就调用this.drawPie()并触发内部的.setOption函数,重新渲染一次图表。

    1afaa4f4e78196c1b419bd17161c6d20.png

      如何更换边框

      边框是使用了 DataV 自带的组件,如:

    6f7cfc29a026deef5d9aa29f0cf2992d.png

      只需要去 views 目录下去寻找对应的位置去查找并替换就可以,具体的种类请去 DavaV 官网查看

      如何更换图表

      直接进入 components/echart 下的文件修改成你要的 echarts 模样,可以去echarts 官方社区里面查看案例。

      四、更新情况

      如果大家有意见请进行评论,小编也会尽力去更新。如还有其他关于数据可视化的疑问,可登录优艺点查看最新资讯。

    展开全文
  • vue-big-screen 基于 vue+datav+echart 框架构建的可视化数据大屏项目,star高达1.1K+。提供数据动态渲染、屏幕自适应、内部图表自由替换等功能。目录结构安装使用#下载项目git clone ...
  • 简介GitDataV基于Vue框架构建的github数据可视化平台,是一个github“大数据可视化平台”,通过它你可以更直观的看到你在github里的一些数据:个人信息(✔),仓库stars情况(✔),仓库语言分类(✔)仓库公开数量(✔)、...
  • 今天给大家分享一款高质量的Vue动态可视化大屏模板VueBigScreen。vue-big-screen 基于 vue+datav+echart 框架构建的可视化数据大屏项目,star高达1.1K+。提供数据动态渲染、屏幕自适应、内部图表自由替换等功能。...
  • 写在前面GitDataV,是一个github“大数据可视化平台”,通过它你可以更直观的看到你在github里的一些数据,(之所以打双引号,是因为我觉得这个还没到大数据可视化的程度)。其实我在 上篇文章 分享的时候已经提到了这...
  • 一、项目描述一个基于 Vue、Datav、Echart 框架的 " 数据大屏项目 ",通过 Vue 组件实现数据动态刷新渲染,内部图表可实现自由替换。部分图表使用 DataV 自带组件,可进行更改,详情请点击下方 DataV 文档。项目需要...
  • 使用vue全家桶以及v-charts和datav实现一个github可视化大数据界面展示,没有设计搞的原因,只能忽略设计编写一下界面,用户只需要登录的时候填写自己github用户名。就可以看到数据展示在登录的时候,可能会存在登录...
  • 项目名称:vue-big-screen项目作者:奔跑的面条开源许可协议:Apache-2.0项目地址:https://gitee.com/MTrun/big-screen-vue-datav项目简介一个基于 vue、datav、Echart 框架的 "数据大屏项目",通过 vue 组件实现...
  • 初步整合vue-element-admin和GitDataV两个Vue开源框架方案,实现满足大数据可视化业务需求。
  • Vue+Echarts构建大数据可视化酷屏展示公司品牌实战项目(下) 阅读本篇文章之前,可以先看看上一篇分享的内容,主要讲大数据可视化的由来,与前端的渊源,主题风格设计,选择比较流行的可视化第三方库。 一个...
  • 今天给大家分享一款高质量的Vue动态可视化大屏模板VueBigScreen。vue-big-screen 基于 vue+datav+echart 框架构建的可视化数据大屏项目,star高达1.1K+。提供数据动态渲染、屏幕自适应、内部图表自由替换等功能。...
  • 大数据可视化数字滚动特效,前端控件,支持数据滚动特效,不会影响原有的样式,用法简单,里面有示例可参考,体积小,如果使用vue架构也是支持,里面包含了安装命令以及使用示例代码,直接上手可用。
  • 图表 背景半透明效果参见下篇:X Tesla:【UE4】嵌入ECharts大数据可视化中国地图​zhuanlan.zhihu.com【前言】:虚幻好看的可视化图表要么实现起来麻烦,要么少得可怜,只能借力网页了。ue4,用蓝图如何实现,数学...
  • 分享一套大屏可视化demovue+echart+datav可视化大屏模板大屏可视化第三弹-特种设备综合监管大屏模板大屏可视化第四弹-3D图表展示大屏可视化第五弹-前端数据大屏好多小伙伴都在评论区留言想要关于教育行业的大屏可视...
  • 一个基于Vue前端框架和第三方图表库Echarts构建的可视化大数据平台,通过vue项目构建、指令的灵活运用、组件封装、组件之间通信,使内部图表组件库可实现自由替换和组合。以及一些功能模块的设计及代码实现。 ...
  • 具体来说一个使用 JavaScript 实现的开源可视化库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器,底层依赖轻量级的矢量图形库ZRender,提供直观,交互丰富,可高度个性化定制的数据可视化图表。...
  • 下面是要实现大数据数据可视化要加入的配置: // The Vue build version to load with the `import` command // (runtime-only or standalone) has been set in webpack.base.conf with an alias.

空空如也

空空如也

1 2 3 4 5 ... 11
收藏数 204
精华内容 81
关键字:

vue大数据可视化

vue 订阅