wxml:
<view class="echarts-wrap" wx:if="{{hasPie==1}}">
<ec-canvas id="mychart" canvas-id="mychart" ec="{{ ec }}" >
</view>
wxss:
.echarts-wrap{width:100%; height:400rpx; margin:0 auto;}
ec-canvas{width:100%; height:100%;}
js:
import *as echartsfrom '../../components/ec-canvas/echarts.min';
var arr=[],chart;
function initChart(canvas, width, height) {
chart = echarts.init(canvas, null, {
width: width,
height: height
});
canvas.setChart(chart);
var option = {
tooltip: {
trigger:'item',
formatter:"{c|{c}单}\n{b|{b}}{per|{d}%}"
},
backgroundColor:"#ffffff",
series: [{
type:'pie',
center: ['50%', '50%'],
radius: ['30%', '60%'],
label: {
normal: {
formatter:'{c|{c}单}\n\n{b|{b}}{per|{d}%} ',
rich: {
c: {
color:'#333',
},
b:{
color:'#333',
},
per: {
color:'#333',
}
}
}
},
data: arr,
}]
};
chart.setOption(option);
return chart;
}
Page({
/**
* 页面的初始数据
*/
data: {
ec: {
onInit:initChart
},
hasPie:1
},
/**
* 生命周期函数--监听页面加载
*/
onLoad:function (options) {
},
getData:function(){
let that=this;
arr=[];
$post('owner/orderStatisticsPiehCart', {
}).then(res=>{
let data=res.data;
if(data==''){
that.setData({
hasPie:2
})
}else{
that.setData({
hasPie:1
})
data.map(n=>{
arr.push({
value:n.orderCount,
name:n.channelName,
label:{
show:false
},
labelLine:{
show:false
}
})
})
var option = chart.getOption();
option.series[0].data = arr;
chart.setOption(option, true);
}
})
},
onShow:function () {
this.getData();
},
