vue3 数据可视化大屏 组件效果,当前组件由5个半圆背景,一个中心圆背景组成。
5个半圆使用gsap依次加载的动画组成,中间通过css的方式加载动画。
静态效果
动态效果
组件代码
<div class="mainRight1s">
...
yekong
1年前 (2023-09-12)
vue3 数据可视化大屏 组件效果,由多个六边形组成的六边形组效果。为了让六边形组不是那么死板,这里还增加了一点动画效果。
小六边形内包含了百分比以及数字标题内容。
组件以1 2 3 2 1的方式堆叠组成。
静态效果
动态效果
组件代码
<template>
...
yekong
1年前 (2023-07-14)
卡片效果为标题,数字。
数字使用数字滚动组件。
静态效果
动态效果
标题渐变色
标题文字使用了从上到下的渐变色
font-size: 16px;
font-family: MicrosoftYaHei;
font-weight: bold;
color: #FFFFFF;
...
yekong
1年前 (2023-06-09)
可视化数据大屏 项目卡片效果,图标数字加文字描述。
效果截图
效果代码
<template>
<div class="list">
<div class="listItem wow fadeInLeft" :data-wow-de...
yekong
1年前 (2023-05-20)
可视化数据大屏 项目卡片效果,图标数字加文字描述。
效果截图
演示地址:
## 效果代码
<template>
<div class="pageCard">
<div class="pageCardIte...
yekong
1年前 (2023-05-18)