数据可视化大屏项目开发中，会遇到ui设计图中文字是渐变色加阴影的效果。
ui设计图效果如下
css实现
我们通过蓝湖生成的css生成出来的样式效果，这和我们的预期差别太大了。
这里我们可以使用伪类来实现我们想要的效果
使用伪元素
通过使用伪元素 ::before 或 ::af...
yekong
4周前 (07-02) 104℃
0喜欢
数据可视化大屏 项目开发中，会添加动画来点缀页面，有些可以通过css来实现动画，有些图片序列帧动画，序列帧动画可以通过css+雪碧图的方式来实现，也可以通过js的方式来实现，今天是使用canvas+js来实现。
准备序列帧图片
我们首先需要准备序列帧图片，这里我们准备了75张序列...
yekong
4周前 (07-02) 1384℃
0喜欢
需求
在Vue项目开发中，有时我们需要实现一个Tab菜单，当点击某个Tab时，该Tab能够自动居中显示。本文将介绍如何使用Vue和BetterScroll库实现这一功能。
动态效果
代码实现
以下是完整的代码实现，包括模板、脚本和样式部分。
模板部分
<template...
yekong
2个月前 (06-07) 1338℃
5喜欢
要在 Vue.js 项目中使用 Canvas 实现随机验证码，并进行对比验证，可以按照以下步骤进行：
创建一个 Canvas 组件：用于生成随机验证码。
在登录表单中引入 Canvas 组件：并实现点击刷新验证码的功能。
在登录逻辑中进行验证码的对比验证。
以下是具体的实现...
yekong
2个月前 (05-19) 125℃
0喜欢
vue 数据可视化大屏 实现进度条效果，通过10种颜色图标实现进度条背景色。
使用组件
<template>
<div class="list">
<div class="titleBody"&g...
yekong
3个月前 (05-01) 686℃
1喜欢
左侧为进度条和标题 右侧为相关数字以及文字说明。
进度条设置两层，底层为进度条底图，上层为进度条占比，通过数据计算div宽度来实现进度条占比，使用gsap补间动画 来实现进度条的动画，通过index来控制当前进度条的颜色。
动态效果
使用组件
<template>...
yekong
3个月前 (04-24) 960℃
0喜欢
echarts项目开发中，需要显示雷达图，雷达图要求在刻度上显示内容，今天我们将实现方法记录下来。
echarts版本
"echarts": "^5.4.1",
首选在刻度上显示内容
我们只需要在radar下面增加axisLabel设...
yekong
3个月前 (04-20) 131℃
0喜欢
vue3 数据可视化大屏 - 数据资产大屏 项目开发中， 需要下拉菜单选择内容，设计师对这个下拉菜单做了美化，在设计图中多余遇到不同样式的下拉菜单，每次都要重新写样式，很耗费时间，所以想着把可能会修改的关键代码都列出来，下次就可以针对性的修改,节省开发时间。
因为element-...
yekong
3个月前 (04-20) 1572℃
0喜欢
vue 数据可视化大屏 项目中要求列表可以自动滚动，当前使用的是vue2实现的效果，如果要使用vue3的话，可以通过vue3 使用vue3-seamless-scroll实现列表无缝滚动插件实现.
安装依赖
# vue3
# yarn
yarn add @meruem117/v...
yekong
4个月前 (04-01) 1517℃
0喜欢
vue2项目开发中，需要实现轮播，并且轮播的效果类似3d效果。
效果截图
动态效果
演示地址
vue2 实现走马灯3d轮播效果
使用插件
这里使用到了vue-carousel-3d插件，vue-carousel-3d介绍
安装插件
pnpm i vue-carousel-3d...
yekong
4个月前 (03-17) 595℃
2喜欢
