首先去百度下载Echarts2,然后引入。
默认的案例够画饼图了,但是我为了去除饼图的指示线和指示名称,所以用了itemStyle。
<script type="text/javascript">
require.config({
paths : {
'echarts' : 'js/echarts',
'echarts/chart/pie' : 'js/echarts'
}
});
// 使用
require(
[
'echarts', 'echarts/chart/pie' // 按需加载
],
function(ec) {
var myChart = ec.init(document.getElementById('main2'));
var option = {
tooltip: {
trigger: 'item',
formatter: "{a} <br/>{b}: {c} ({d}%)"
},
color:['#AD3733', '#CD5C5C'],
series: [
{
type:'pie',
radius: ['20%', '60%'],
avoidLabelOverlap: false,
itemStyle: {
normal: {
label: {
show: true,
//formatter: '{d}%'
},
labelLine: {
show: true
}
},
emphasis: {
label: {
show: true
},
labelLine: {
show: true
}
}
},
data:[
{value:1200, name:'未超时',selected:true},
{value:315, name:'超时'}
]
}
]
};
myChart.setOption(option);
});
</script>
版权声明:本文为woerry原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。