echar饼状图在区域名字后显示值及其百分比

最新推荐文章于 2024-05-10 15:27:42 发布

yulongkuke

最新推荐文章于 2024-05-10 15:27:42 发布

阅读量1.3w

点赞数

分类专栏： echar 文章标签： echar饼状图在区域名字后显示值及其百

本文链接：https://blog.csdn.net/yulongkuke/article/details/46547607

版权

echar 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<!DOCTYPE html> <head> <metacharset="utf-8"> <title>ECharts</title> </head> <body>  <divid="main"style="height:400px"></div>  <script src="http://echarts.baidu.com/build/dist/echarts.js"></script> <scripttype="text/javascript"> // 路径配置 require.config({ paths: { echarts: 'http://echarts.baidu.com/build/dist' } }); // 使用 require( [ 'echarts', 'echarts/chart/bar' // 使用柱状图就加载bar模块，按需加载 ], function (ec) { // 基于准备好的dom，初始化echarts图表 var myChart = ec.init(document.getElementById('main')); option = { title : { text: '地区生成总值产业构成', x:'center', y:'top',textStyle:{fontFamily:'Microsoft Yahei'}, link: 'javascript:f_open(option03)', target:'self' }, //提示框，鼠标悬浮交互时的信息提示 tooltip : { trigger: 'item', formatter: "{a} <br/>{b} : {c} ({d}%)" }, toolbox: { show : true }, calculable : true, series : [ { name:'地区生成总值', type:'pie', radius : '55%',center: ['50%', '60%'], itemStyle : { normal : {label : { show:true, textStyle : { fontFamily: 'Microsoft YaHei', fontSize : '12', fontWeight : 'bold'}, formatter: "{b} : {c} 亿元\n{d}%"//在区域名字后显示值及其百分比 }, labelLine:{show:true} },}, data:[ {value:15.2, name:'大港街'}, {value:9.5, name:'华尔街'}, {value:12, name:'步行街'}, {value:3.8, name:'经济区'}, ] } ] }; // 为echarts对象加载数据myChart.setOption(option);} ); </script> </body>