title: { text: '天气情况统计', //标题 subtext: '虚构数据', //副标题 left: 'center' //标题位置 }, tooltip: { trigger: 'item', formatter: "{a} <br/>{b} : {c} ({d}%)" //鼠标移上去显示的内容 }, normal: { show: true, position: 'inside', //图形里显示(比如在饼图块上显示百分比) formatter: '{d}%' //显示的内容 }, textStyle: { fontWeight: 'normal', //显示字体粗细等 fontSize: 10 }, legend: { //图例 // top: 'middle', // bottom: 10, // left: 'center', icon: "circle", //圆点形图例(默认是官网上的圆角矩形) itemWidth: 10, //这几个是图例宽高位置等的设置 itemHeight: 10, itemGap: 20, left: 100, top: 110, bottom: 20, textStyle: { // fontSize: 5 color: "#fff" //图例字体颜色等 }, data: ['规划问题', '设计问题', '优化问题', '维护问题'] }, series: [{ type: 'pie', //图表类型 这里是饼图 radius: '35%', //饼图大小 center: ['50%', '50%'], //在div中位置 selectedMode: 'single', labelLine: { normal: { length: 4 //标识线 } }, data: [{ value: 64, name: '规划问题' }, //数据 { value: 73, name: '设计问题' }, { value: 80, name: '优化问题' }, { value: 80, name: '维护问题' }, ], label: { //饼图图形上的文本标签 normal: { show: true, position: 'inner', //标签的位置 textStyle: { fontWeight: 300, fontSize: 10 //文字的字体大小 }, formatter: '{d}%' //显示% } }, itemStyle: { emphasis: { shadowBlur: 10, //阴影设置 shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } }] toolbox: { //工具组小按钮等 show: true, feature: { dataZoom: { yAxisIndex: 'none' }, dataView: { readOnly: false }, //magicType: {type: ['line', 'bar']},//折线图、柱状图切换 //restore: {},//恢复,即刷新图表 //saveAsImage: {}//保存为图片 } }, xAxis: { //设置横坐标(折线图里使用) type: 'category', axisLabel: { //横坐标的控制 show: true, //是否显示横坐标数据 rotate: 30, //坐标的倾斜角度 inside: false, //刻度是否朝内 margin: 8, //标尺与轴线的距离,默认8 }, boundaryGap: false, data: ['05.02', '05.03', '05.04', '05.05', '05.06', '05.07', '05.08'] }, graphic: { //环形图中间显示字 type: 'text', left: 'center', top: 'center', style: { text: 'xxxxxxx', textAlign: 'center', fill: '#000', width: 30, height: 30 } }
2019年3月12日
0
2822