echarts柱状图除了常见的柱状图外，还有一种是图片类型的柱状图，或者说图标柱状图，
使用两张图标，一张图标表示底图，一张图标表示占比状态，通过pictorialBar来将两种图片图片重叠显示，达到类似下面的效果。
演示效果
实例代码
<template>
...
yekong
2年前 (2023-04-20)
喜欢
echarts 柱状图顶部显示label 柱状图自身颜色渐变，并显示单位，网格线为虚线效果。
演示实例
使用组件
<template>
<div class="itemBodys">
<echarts1 :list...
yekong
2年前 (2023-04-17)
喜欢
上一节，我们实现了数据可视化大屏入场动画教程，这一节我们来完成第一个区域的功能，使用echarts绘制柱状图.
根据数据大屏设计图来看，我们一共有10个区域，所以我们创建10个item,来对应这10个区域.
为什么用编号不用名称呢？一开始的项目中，用过拼音用过英文，但是实际开发的...
yekong
2年前 (2023-03-30)
喜欢
vue数据大屏需要实现类似甘特图的效果，效果图如下，将实现的效果记录下来，方便后期复用。
实例代码
<template>
<div class="echarts1" ref="echarts">
<...
yekong
2年前 (2023-03-22)
喜欢
最近要写一个新的数据大屏可视化 页面，其中有一个排名功能，设计图ui效果如下，使用echarts实现效果，但是效果图里面的头部是一个倾斜角，echarts默认并没有，所以需要将柱状图分为两部分，顶部的倾斜角使用echarts的pictorialBar自定义图片来实现，下面的柱子使...
yekong
2年前 (2023-02-22)
喜欢
vue外包项目 经常会遇到需要排行榜的效果，这次ui设计 出的数据可视化大屏 里排行榜效果如下：
效果描述
排行榜柱状图的颜色需要渐变
排行榜柱状图的尾端有一段与其他部位不同的白色色块
排行榜柱状图的数字颜色跟随柱状图的颜色变化
排行榜柱状图有一个边框
ui设计图的效果
ech...
yekong
2年前 (2023-02-21)
喜欢
echarts 菱形柱状图效果
实现代码
<template>
<div class="echarts1" ref="echarts">
</div>
</template>
&...
yekong
2年前 (2022-12-16)
喜欢
vue echarts 实现进度条效果
更多进度条效果实例
vue 数据可视化大屏进度条效果实例
使用
<echarts title="当月" :num="50"></echarts>
组件代码
<tem...
yekong
2年前 (2022-12-16)
喜欢
实现代码
<template>
<div class="echarts1" ref="echarts">
</div>
</template>
<script>
expo...
yekong
2年前 (2022-11-30)
喜欢
echarts 异形柱状图效果
实现代码
drawLine() {
var that = this
// 基于准备好的dom，初始化echarts实例
window.addEventListener('resize', this.drawLine)
const ...
yekong
2年前 (2022-11-30)
喜欢
