饼图---05

let myChart = echarts.init(document.getElementById(“fourChart1”));
var trafficWay = [
{
name: ‘待处置’,
value: 20,
},
{
name: ‘已处置’,
value: 10,
},
{
name: ‘处置中’,
value: 30,
},
{
name: ‘搁置’,
value: 40,
},
];

var data = [];
var color = [‘#2ca1ff’, ‘#0adbfa’, ‘#febe13’, ‘#65e5dd’];
for (var i = 0; i < trafficWay.length; i++) {
data.push(
{
value: trafficWay[i].value,
name: trafficWay[i].name,
itemStyle: {
normal: {
borderWidth: 8,
shadowBlur: 20,
borderRadius: 20, _// 圆角
_borderColor: color[i],
shadowColor: color[i],
},
},
},
{
value: 8,
name: ‘’,
itemStyle: {
normal: {
label: {
show: false,
},
labelLine: {
show: false,
},
color: ‘rgba(0, 0, 0, 0)’,
borderColor: ‘rgba(0, 0, 0, 0)’,
borderWidth: 0,
},
},
}
);
}
var seriesOption = [
{
name: ‘’,
type: ‘pie’,
clockWise: false,
radius: [‘50%’, ‘45%’],
hoverAnimation: false,
center: [‘50%’, ‘35%’],
itemStyle: {
normal: {
label: {
show: false,
},
},
},
data: data,
},
];

let option = {
// backgroundColor: ‘#0A2E5D’,
_color: color,
tooltip: {
show: false,
},
toolbox: {
show: false,
},
legend: [{
orient: “vertical”,
left:’30%’,
bottom: “10%”,
itemWidth: 10,
itemHeight: 10,
align: “left”,
// width:10,
textStyle: {
fontSize: 13,
color: ‘#a9d2ff’,
rich: {
name: {
color: ‘#a9d2ff’,
align: ‘left’,
// width: 60,
// padding:[0,10,0,0]
},
percent: {
// color: ‘#f8c700’,
align: ‘right’,
}
}
},
formatter(name) {
let data = option.series[0].data;
let value = ‘’;
for (let i = 0; i < data.length; i++) {
if (data[i].name == name) {
value = data[i].value;
break;
}
}
let arr = []
for (let i = 0; i < data.length; i++) {
arr.push(data[i].value);
}
sum = arr.reduce(function(prev,cur,index,array){
return prev + cur
})
let percent = 0
percent = (value / sum)*100
return ‘{name|’ + name + ‘} | ‘+’{percent|’+percent.toFixed(0)+’%}’;
},
data: data.slice(Math.floor(data.length / 2), data.length),
},
{
orient: “vertical”,
left:’30%’,
bottom: “20%”,
itemWidth: 10,
itemHeight: 10,
align: “left”,
// width:10,
textStyle: {
fontSize: 13,
color: ‘#a9d2ff’,
rich: {
name: {
color: ‘#a9d2ff’,
align: ‘left’,
// width: 60,
// padding:[0,10,0,0]
},
percent: {
// color: ‘#f8c700’,
_align: ‘right’,
}

            }<br />            },<br />            formatter(name) {<br />            let data = option.series[0].data;<br />            let value = '';<br />            for (let i = 0; i < data.length; i++) {<br />                if (data[i].name == name) {<br />                    value = data[i].value;<br />                    break;<br />                }<br />            }<br />            let arr = []<br />            for (let i = 0; i < data.length; i++) {<br />                arr.push(data[i].value);<br />            }<br />            sum = arr.reduce(function(prev,cur,index,array){<br />                return prev + cur<br />            })<br />            let percent = 0<br />            percent = (value / sum)*100<br />            return '{name|' + name + '} | '+'{percent|'+percent.toFixed(0)+'%}';<br />        },<br />            data: data.slice(0, Math.ceil(data.length / 2)),<br />        }<br />    ],<br />    title: [<br />        {<br />            text: '处置进度',<br />            top: '32%',<br />            left: "49%",<br />            textAlign: 'center',<br />            textStyle: {<br />                color: '#a9d2ff',<br />                fontSize: 18,<br />            },<br />        },<br />    ],<br />    series: seriesOption,<br />};<br />myChart.setOption(option);<br />$(window).resize(myChart.resize);