vue-Echarts柱状图箭头增长下降

用户1989.

已于 2023-02-21 10:55:45 修改

阅读量932

点赞数 2

分类专栏： echarts 文章标签： echarts 前端 javascript vue.js

于 2023-02-21 10:54:05 首次发布

本文链接：https://blog.youkuaiyun.com/m0_64097839/article/details/129138097

版权

实现效果

简介--变量

newArr = [] // 存放柱图数据
oldArr = [] // 定义在return data 存放上一次柱图数据
Array = [] // 趋势上下数据 数据来源为新柱图数据 - 上一次柱图数据
count = '' // 用于计数 第一次加载页面为 oldArr 赋值
// 数据为模拟数据

实现过程

let _this = this
let newArr = [] // 存放柱图数据
let Array = [] // 趋势上下数据
// 模拟数据
for (let i = 0; i < 5; i++) {
  newArr.push(Math.round((Math.random() * 300) + 1000))
}
this.count++
// 第一次进入页面赋值 count计数 测试数据
if (this.count === 1) {
  this.oldArr = newArr
} else {
  setTimeout(() => {
    this.oldArr = newArr
  }, 2000)
}
for (let z