//基于准备好的dom,初始化echarts实例
var pieEchart = echarts.init(document.getElementById(‘pieEchart‘));//指定图表的配置项和数据
var pieoption ={
title : {
text:‘公里总里程‘,
x:‘left‘,
textStyle:{
color:‘#FFFFFF‘,
fontSize:25}
},
tooltip : {
trigger:‘item‘,
formatter:"{a}
{b} : {c} KM"},
legend: {
orient :‘vertical‘,
x :‘left‘,
top:40,
itemWidth:70,
itemHeight:30,
formatter:‘{name}‘,
textStyle:{
color:‘#FFFFFF‘},
data:[{name:‘高速50KM‘,icon:‘rect‘},{name:‘一级150KM‘,icon:‘rect‘},{name:‘二级150KM‘,icon:‘rect‘},{name:‘三级100KM‘,icon:‘rect‘},{name:‘四级50KM‘,icon:‘rect‘}] }
,
calculable :true,
series : [
{
name:‘公里总里程‘,
type:‘pie‘,
radius :‘70%‘,//饼图的半径大小
center: [‘60%‘, ‘60%‘],//饼图的位置
label:{ //饼图图形上的文本标签
normal:{
show:true,
position:‘inner‘, //标签的位置
textStyle : {
fontWeight :300,
fontSize :16 //文字的字体大小
},
formatter:‘{d}%‘}
},
data:[
{value:50,name:‘高速50KM‘,itemStyle:{normal:{color:‘#FE0000‘}}},
{value:150,name:‘一级150KM‘,itemStyle:{normal:{color:‘#F29700‘}}},
{value:150,name:‘二级150KM‘,itemStyle:{normal:{color:‘#02B0ED‘}}},
{value:100,name:‘三级100KM‘,itemStyle:{normal:{color:‘#55E87D‘}}},
{value:50,name:‘四级50KM‘,itemStyle:{normal:{color:‘#FFE200‘}}},
]
}
]
};//使用刚指定的配置项和数据显示图表。
pieEchart.setOption(pieoption);