标签:数据可视化大屏教程

数据可视化大屏素材

vue 数据可视化大屏进度条效果实例

vue 数据可视化大屏进度条效果实例
vue 数据可视化大屏 项目开发中经常会遇到各种各样的进度条效果,想来将来可能会遇到类似的效果就将对应的效果实例给记录下来。 如果您需要设计属于自己的 可视化数据大屏 可以联系我们微信:17331886870 21 vue 数据可视化大屏性别占比进度条 效果实例代码:vue 数据...

yekong 1年前 (2023-07-29) 喜欢

vue

vue3 vite 数据可视化大屏教程

vue3 vite 数据可视化大屏教程
数据可视化大屏辅助工具 在我们写数据可视化大屏页面的时候,我们需要一些辅助工具,来让帮助我们快速完成我们的项目。 蓝湖是一款不错的辅助工具,能够让我们快速从设计图中获取我们想要的参数。 photoshop Cutterman切片工具,可以快速将我们需要的图片导出到我们的文件夹中。...

yekong 2年前 (2023-04-29) 喜欢

echarts

vue项目echarts效果实例整理

vue项目echarts效果实例整理
vue数据可视化大屏项目中会遇到各种各样的需求,随着项目的积累,效果也越来越多,为了提升开发效率,也会不断的积累效果代码,让其能够快速应用到新的项目用。 下面整理出最近在做项目时,所积累下来的一些效果实例。 echarts echarts是数据可视化大屏项目用用的最多的插件之一,...

yekong 2年前 (2023-03-31) 喜欢

vue

vue3 数据可视化大屏循环请求接口

vue3 数据可视化大屏循环请求接口
vue3 数据可视化大屏项目中,因为数据需要,我们需要先通过接口获取到列表数据,然后再通过列表数据中指定的字段来获取下一级数据,这时候我们需要进行循环请求接口。 请求接口获取列表 首先请求接口获取列表,然后for循环,获取指定字段的值,通过这个值再次请求接口。 getData()...

yekong 2年前 (2023-03-31) 喜欢

vue

vue transition结合gsap实现动画效果实例

vue transition结合gsap实现动画效果实例
vue项目开发中,为了让大屏更酷炫,会添加很多动画元素,今天来讲一下vue下transition结合gsap补间动画插件实现动画效果。 安装依赖 npm install gsap 引入组件 import gsap from 'gsap'; 使用JavaScript来执行过渡动...

yekong 2年前 (2023-03-31) 喜欢

echarts

vue3 vite使用echarts绘制饼状图

vue3 vite使用echarts绘制饼状图
上一节,我们实现了使用echarts绘制柱状图,这一节我们来完成第二个区域的功能,使用echarts绘制环形饼状图. 设计图的效果图如下: 看效果比较眼熟,和自己之前做过的项目数据可视化大屏 - 固废全过程一个效果很相似,我们拿过来改一下应该就可以用了。当我们效果积累到多了,就...

yekong 2年前 (2023-03-30) 喜欢

工具

使用Cutterman辅助导出设计图图片

使用Cutterman辅助导出设计图图片
Cutterman这款插件一开始是免费的,现在改为了收费版,35元永久,这里收藏了Cutterman最后一个免费版本,如果需要的话可以下载试试 在使用photoshop进行设计图处理的时候,我们导出设计图的一些图片元素,如果手动处理的话,会比较麻烦,我们可以通过Cutterman...

yekong 2年前 (2023-03-30) 喜欢

工具

使用蓝湖辅助开发数据可视化大屏

使用蓝湖辅助开发数据可视化大屏
数据可视化大屏项目开发中,除了设计师提供给我们设计图外,我们还需要快速的从设计图中提取我们需要的信息,这时候我们需要用到蓝湖了。 蓝湖提供了很多插件,可以让我们快速的将设计图导入到蓝湖。 设计规范云 蓝湖Axure Figma 插件 Sketch 插件 Photoshop 插件 ...

yekong 2年前 (2023-03-30) 喜欢

echarts

vue3 vite 使用echarts绘制柱状图

vue3 vite 使用echarts绘制柱状图
上一节,我们实现了数据可视化大屏入场动画教程,这一节我们来完成第一个区域的功能,使用echarts绘制柱状图. 根据数据大屏设计图来看,我们一共有10个区域,所以我们创建10个item,来对应这10个区域. 为什么用编号不用名称呢?一开始的项目中,用过拼音用过英文,但是实际开发的...

yekong 2年前 (2023-03-30) 喜欢