init图表的时候加了个计时器 解决了这个问题 但是有时候还会消失
/**
* 初始化echarts
* @params index {number} 导购业绩列表索引
* @params line {null} 导购业绩echarts配置数据
* @params percentage {number} 导购业绩占比
* @params colorItem {object} echarts图表颜色
*/
initGuidekpiItemEcharts(index, line, percentage, colorItem) {
setTimeout(()=>{
this.selectComponent(`#results_echarts${index}`).init((canvas, width, height, dpr) => {
//初始化echarts元素,绑定到全局变量,方便更改数据
line = echarts.init(canvas, null, {
width: width,
height: height,
devicePixelRatio: dpr
});
canvas.setChart(line);
var option = getResultsOption(percentage, colorItem);
line.setOption(option);
return line
})
},500)
},
/**
* 重置图表数据
* @params chart {func} echarts数据
* @params callback {func} 重置回调
*/
setOption(chart, callback) {
chart.clear()
chart.setOption(callback)
},
/**
* 导购业绩列表
*/
getGuidekpiList() {
const {
dateTime,
checkedBranch
} = this.data;
let params = {
theDate: dateTime,
branchNo: checkedBranch.branchNo
}
const colorList = [{
startGradient: "#0F8CF5",
endGradient: '#0BCEFB'
}, {
startGradient: '#F68908',
endGradient: "#FECD02"
}, {
startGradient: '#CA0A7E',
endGradient: '#FC6ED8'
}, {
startGradient: '#B90404',
endGradient: '#FB4D51'
}];
let colorIndex = 0;
getGuidekpiList(params).then(res => {
const guidekpiEcObject = {};
guideKpiLineObject = {} //每次刷新接口重置line
for (let index = 0; index < res.data.length; index++) {
guideKpiLineObject['guideKpiLine' + index] = null
guidekpiEcObject['results_echartsec' + index] = {
lazeLoad: true
}
}
this.setData({
guidekpiList: res.data,
guidekpiEcObject
})
for (let newIndex = 0; newIndex < res.data.length; newIndex++) {
if (colorIndex >= 4) {
colorIndex = 0
}
if (guideKpiLineObject['guideKpiLine' + newIndex]) {
this.setOption(guideKpiLineObject['guideKpiLine' + newIndex], getResultsOption(Number(res.data[newIndex].completedKpi / (res.data[newIndex].totalKpi == 0 ? 1 : res.data[newIndex].totalKpi) / 100), colorList[colorIndex]))
} else {
this.initGuidekpiItemEcharts(newIndex, guideKpiLineObject['guideKpiLine' + newIndex], Number(res.data[newIndex].completedKpi / (res.data[newIndex].totalKpi == 0 ? 1 : res.data[newIndex].totalKpi) / 100), colorList[colorIndex])
}
colorIndex += 1
}
})
},
onLoad(){
this.getGuidekpiList()
}