分类:vue

vue开发笔记

vue 数据可视化大屏进度条效果实例 24小时内最新

vue 数据可视化大屏进度条效果实例
vue 数据可视化大屏 项目开发中经常会遇到各种各样的进度条效果,想来将来可能会遇到类似的效果就将对应的效果实例给记录下来。 如果您需要设计属于自己的数据可视化大屏 可以联系我们微信:17331886870 进度条效果1 进度条效果: 进度条颜色是渐变色,可以通过传值自定义 进度...

yekong 12小时前 13℃ 0喜欢

数据可视化大屏进度条效果实例渐变色进度条 24小时内最新

数据可视化大屏进度条效果实例渐变色进度条
进度条效果: 进度条颜色是渐变色,可以通过传值自定义 进度条带有动画效果 使用gsap实现补间动画 进度条有最大宽度,给右侧留有展示数据的空间 进度条有默认背景色 进度条宽度根据总数和当前数据计算百分比 使用组件 <progressBar class="wow ...

yekong 12小时前 11℃ 0喜欢

vue3 vite 数据可视化大屏接口调用实例 24小时内最新

vue3 vite 数据可视化大屏接口调用实例
vue3 vite 数据可视化大屏 项目开发中需要和后端进行数据交互,这需要后端开发人员提供接口文档,前端开发人员根据接口文档进行接口调用。 安装依赖 要请求接口数据我们需要插件,这里我们使用axios来请求接口 使用pnpm来安装依赖 pnpm i axios 使用axios...

yekong 17小时前 12℃ 0喜欢

vue vite引入glsl文件

vue vite引入glsl文件
vue vite项目中引入glsl文件后会报错Unexpected identifier 'vec2',我们需要配置一下vite-plugin-glsl。 安装依赖 pnpm i vite-plugin-glsl 编辑vite.config.js文件 import {defin...

yekong 2天前 13℃ 0喜欢

vue html仿echarts柱状图效果实例

vue html仿echarts柱状图效果实例
vue 数据可视化大屏项目开发中,有一个类似echarts柱状图的效果实例,不过和柱状图有一些区别,所以使用的html+css+js的方式来写的。 效果要求 柱状图组件按照百分比占比来表示长度,为了避免数字占比小而无法装下数字,设置了一个最小宽度。 左下角有说明标签,标签点击后可...

yekong 5天前 31℃ 0喜欢

vue axios结合elment upload实现上传文件显示进度

vue axios结合elment upload实现上传文件显示进度
axios上传文件的时候,如果文件太大的话,就需要添加一个上传进度了解上传情况,所以我们添加一个进度提示,axios上传进度是通过onUploadProgress来获取的。 html <el-dialog title="上传文件到内部存储或SD卡1"...

yekong 2周前 (03-16) 66℃ 0喜欢

vue3 vite 反向代理配置

vue3 vite 反向代理配置
vue3 vite项目进行接口调用的时候,会遇到跨域的问题,这时候就需要配置反向代理了。 vite 反向代理说明文档 反向代理说明文档 vite 反向代理配置代码 import {defineConfig} from 'vite'; import vue from '@vitej...

yekong 2周前 (03-15) 54℃ 0喜欢

vue 使用canvas实现序列帧动画效果

vue 使用canvas实现序列帧动画效果
数据可视化大屏 项目开发中,会添加动画来点缀页面,有些可以通过css来实现动画,有些图片序列帧动画,序列帧动画可以通过css+雪碧图的方式来实现,也可以通过js的方式来实现,今天是使用canvas+js来实现。 组件使用 <sequence :file-length=&qu...

yekong 2周前 (03-14) 58℃ 0喜欢

高德地图监听地图缩放

高德地图监听地图缩放
可视化大屏项目开发中,有一个需求高德地图上要覆盖一个自定义的地图图片,这个要和区域轮廓一致,但是当地图缩放的时候就会导致图片和轮廓不一致,这时候就需要监听地图的zoom了,当地图zoom和默认不一样的时候就隐藏这个图片。 that.map.on('zoomchange', ()...

yekong 2周前 (03-13) 47℃ 0喜欢