1500字范文,内容丰富有趣,写作好帮手!
1500字范文 > echarts年龄饼图_解决echarts饼图显示百分比 和显示内容字体及大小

echarts年龄饼图_解决echarts饼图显示百分比 和显示内容字体及大小

时间:2018-11-05 19:19:45

相关推荐

echarts年龄饼图_解决echarts饼图显示百分比 和显示内容字体及大小

//基于准备好的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);

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。