VUE+elementui组件在table-cell单元格中绘制微型echarts图

type: 'category',
boundaryGap: false,
data: ['03-21', '03-22', '03-23', '03-24', '03-25', '03-26', '03-27'] },
yAxis: {
show: false,
type: 'value'
},
series: [
{
name: '每日30天销量分析',
type: 'line',
data: [120, 500, 101, 86, 173, 230, 6] }
] };
let chartId = 'tiger-' + arguments[2] + '-trend-index' + arguments[1];
this.$nextTick(() => {
let myChart = this.echarts.init(document.getElementById(chartId), 'macarons');
myChart.setOption(option);
myChart.resize();
});
},

AND 不要忘记设置echarts的高度，否则一辈子也出不来图形（示例，根据实施开发调整）

&-frame {
  display: flex;
  flex-flow: column nowrap;
  justify-content: space-between;
  .price-bar {
   color: red !important;
  }
  .tiger-trend-charts {
   height: 60px;
   min-width: 100px;
  }
 }

到此这篇关于VUE+elementui组件在table-cell单元格中绘制微型echarts图的文章就介绍到这了,更多相关VUE elementui 单元格echarts图内容请搜索软件开发网以前的文章或继续浏览下面的相关文章希望大家以后多多支持软件开发网！