微信小程序开发遇到的问题
uniapp微信小程序使用Echarts的方法
uniapp微信小程序使用Echarts是通过以下方式引用的。
问题
要求点击柱状图，物料统计详情不显示物料为0的数据，也就是说，如果条数很多，但是如果数据值为0那么就不显示对应数据，这就需要tooltip以回调的方式进行自定义处理了。但是在数据中无论怎么传值就是无效。排查了一天的时间终于知道原因了。
解决办法
单独复制一份组件出来，针对性修改。
因为以data方式传值会被过滤掉，所以我们在setOption前，再进行回调就可以了。
async initChart(option) {
// #ifdef MP-WEIXIN || MP-TOUTIAO
const canvasAttr = await this.getCanvasAttr2d();
// #endif
// #ifndef MP-WEIXIN || MP-TOUTIAO
const canvasAttr = await this.getCanvasAttr();
// #endif
const {
canvas,
canvasWidth,
canvasHeight,
canvasDpr
} = canvasAttr
chartList[this.canvasId] = echarts.init(canvas, null, {
width: canvasWidth,
height: canvasHeight,
devicePixelRatio: canvasDpr // new
});
canvas.setChart(chartList[this.canvasId]);
console.log(option)
console.log(this.option)
console.log('ecoptions')
option.tooltip.renderMode = 'richText'
option.tooltip.formatter = function(params) {
let str = params[0].name + "\n";
params.forEach((item, index) => {
if (item.data > 0) {
str += item.marker + item.seriesName + " : " + item.data + "\n";
}
});
str = _.trimEnd(str, '\n');
return str;
}
chartList[this.canvasId].setOption(option ? option : this.option);
},
