[echarts] 更新数据

javascript 复制代码
option = {
  title: { text: '销售数据' },
  tooltip: { trigger: 'axis' },
  legend: { data: ['销量', '库存'] },
  xAxis: {
    type: 'category',
      data: ['衬衫', '羊毛衫', '雪纺衫']
  },
  yAxis: { type: 'value' },
  series: [
    { name: '销量', type: 'bar', data: [5, 20, 36] },
    { name: '库存', type: 'line', data: [10, 25, 30] }
  ]
}
javascript 复制代码
// 在组件中
const updateData = () => {
	const newData = [Math.random() * 100, ...chartOption.series[0].data.slice(0,6)]
	chartOption.series[0].data = newData
}

参考:

Vue 引入 ECharts

相关推荐
欧米欧2 分钟前
STRING的底层实现
前端·c++·算法
2301_814809869 分钟前
踩坑实战pywebview:用 Python + Web 技术打造轻量级桌面应用
开发语言·前端·python
LIO12 分钟前
Vue 3 实战——搜索框检索高亮的优雅实现
前端·vue.js
_thought16 分钟前
踩坑记录:Vue Devtools(Vue2版)在火狐浏览器上,未在控制台显示
前端·javascript·vue.js
pancakenut16 分钟前
从盒模型到画布:以mapbox为例
前端·canvas
珎珎啊21 分钟前
前端-闭包
前端
军军君0123 分钟前
数字孪生监控大屏实战模板:交通云实时数据监控平台
前端·javascript·css·vue.js·typescript·前端框架·echarts
DanCheOo34 分钟前
从脚本到 CLI 工具:用 Node.js 打造你的第一个 AI 命令行工具
前端·aigc
木斯佳34 分钟前
前端八股文面经大全:腾讯PCG前端暑期二战一面·深度解析(2026-04-22)·面经深度解析
前端·面经·实习
十一.36636 分钟前
012-014 对state的理解,初始化state,react中的事件绑定
前端·react.js·前端框架