<el-table-column lazy label="视图" width="120" align="center">
<template slot-scope="scope">
<highcharts :options="scope.row.chartOptions" class="high-chart">
</highcharts>
<!-- <div :ref="'contentEchart' + scope.row.apiId" -->
<!-- style="width:100%; height:60px;"> -->
<!-- </div> -->
</template>
</el-table-column>
const dataName = ['200','500','400','0','401','504','503','429','404','402'];
var seriesArr = [];
dataName.forEach((item,index) => {
let obj = {
name: item,
data: chartData[`total${item}`],
color: item == '200' ? '#82D6C5' : item == '总量' ? '#CACCCE' :
'#EE6666',
stack: 'male'
}
if(obj)
seriesArr.push(obj)
})
this.chartOptions = {
chart: {
type: 'column',
options3d: {
enabled: true,
alpha: 10,
beta: 0,
viewDistance: 25,
depth: 30
},
marginTop: 30,
marginRight: 40
},
title: {
text: '标题'
},
credits: { //去掉highcharts.com
enabled:false
},
xAxis: {
categories: chartData.xAxisData
},
yAxis: {
allowDecimals: false,
min: 0,
title: {
text: '调用量'
}
},
tooltip: {
headerFormat: '<b>{point.key}</b><br>',
pointFormat: '<span style="color:{series.color}">\u25CF</span> {series.name}: {point.y} / {point.stackTotal}'
},
plotOptions: {
column: {
stacking: 'normal',
depth: 40
}
},
series: seriesArr
}