|
@@ -1,811 +1,140 @@
|
|
|
$(window).load(function(){$(".loading").fadeOut()})
|
|
|
$(function () {
|
|
|
- echarts_1();
|
|
|
- echarts_2();
|
|
|
+ // echarts_1();
|
|
|
+ // echarts_2();
|
|
|
// echarts_3();
|
|
|
- echarts_4();
|
|
|
- echarts_5();
|
|
|
- echarts_6();
|
|
|
- zb1();
|
|
|
- zb2();
|
|
|
- zb3();
|
|
|
- zb4();
|
|
|
-function echarts_1() {
|
|
|
- /* 青 岛 研 锦 网 络 科 技 有限公司 版权所有*/
|
|
|
- // 基于准备好的dom,初始化echarts实例
|
|
|
- var myChart = echarts.init(document.getElementById('echart1'));
|
|
|
- option = {
|
|
|
- tooltip : {
|
|
|
- trigger: 'item',
|
|
|
- formatter: "{b} : {c} ({d}%)"
|
|
|
- },
|
|
|
- legend: {
|
|
|
- right:10,
|
|
|
- top:30,
|
|
|
- height:140,
|
|
|
- itemWidth:10,
|
|
|
- itemHeight:10,
|
|
|
- itemGap:10,
|
|
|
- textStyle:{
|
|
|
- color: 'rgba(255,255,255,.6)',
|
|
|
- fontSize:12
|
|
|
- },
|
|
|
- orient:'vertical',
|
|
|
- data:['调速电位器','外壳及零件','热敏开关','加热指示灯','电池']
|
|
|
- },
|
|
|
- calculable : true,
|
|
|
- series : [
|
|
|
- {
|
|
|
- name:' ',
|
|
|
- color: ['#62c98d', '#2f89cf', '#c9c862', '#c98b62', '#c962b9', '#7562c9','#c96262'],
|
|
|
- type:'pie',
|
|
|
- radius : [30, 70],
|
|
|
- center : ['35%', '50%'],
|
|
|
- roseType : 'radius',
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- show: true
|
|
|
- },
|
|
|
- emphasis: {
|
|
|
- show: true
|
|
|
- }
|
|
|
- },
|
|
|
+ // echarts_4();
|
|
|
+ // echarts_5();
|
|
|
+ // echarts_6();
|
|
|
+ // zb1();
|
|
|
+ // zb2();
|
|
|
+ // zb3();
|
|
|
+ // zb4();
|
|
|
+
|
|
|
+
|
|
|
+// function echarts_3() {
|
|
|
+// var myChart = echarts.init(document.getElementById('echart3'));
|
|
|
+//
|
|
|
+// option = {
|
|
|
+// tooltip: {
|
|
|
+// trigger: 'axis',
|
|
|
+// axisPointer: {
|
|
|
+// lineStyle: {
|
|
|
+// color: '#dddc6b'
|
|
|
+// }
|
|
|
+// }
|
|
|
+// },
|
|
|
+// grid: {
|
|
|
+// left: '10',
|
|
|
+// top: '20',
|
|
|
+// right: '30',
|
|
|
+// bottom: '10',
|
|
|
+// containLabel: true
|
|
|
+// },
|
|
|
+//
|
|
|
+// xAxis: [{
|
|
|
+// type: 'category',
|
|
|
+// boundaryGap: false,
|
|
|
+// axisLabel: {
|
|
|
+// textStyle: {
|
|
|
+// color: "rgba(255,255,255,.6)",
|
|
|
+// fontSize:16,
|
|
|
+// },
|
|
|
+// },
|
|
|
+// axisLine: {
|
|
|
+// lineStyle: {
|
|
|
+// color: 'rgba(255,255,255,.1)'
|
|
|
+// }
|
|
|
+// },
|
|
|
+//
|
|
|
+// data: ['模拟考1', '模拟考2', '模拟考3', '模拟考4', '模拟考5', '模拟考6', '模拟考7', '模拟考8', '模拟考9', '模拟考10']
|
|
|
+//
|
|
|
+// }, {
|
|
|
+//
|
|
|
+// axisPointer: {show: false},
|
|
|
+// axisLine: { show: false},
|
|
|
+// position: 'bottom',
|
|
|
+// offset: 20,
|
|
|
+//
|
|
|
+// }],
|
|
|
+//
|
|
|
+// yAxis: [{
|
|
|
+// type: 'value',
|
|
|
+// axisTick: {show: false},
|
|
|
+// axisLine: {
|
|
|
+// lineStyle: {
|
|
|
+// color: 'rgba(255,255,255,.1)'
|
|
|
+// }
|
|
|
+// },
|
|
|
+// axisLabel: {
|
|
|
+// textStyle: {
|
|
|
+// color: "rgba(255,255,255,.6)",
|
|
|
+// fontSize:16,
|
|
|
+// },
|
|
|
+// },
|
|
|
+//
|
|
|
+// splitLine: {
|
|
|
+// lineStyle: {
|
|
|
+// color: 'rgba(255,255,255,.1)'
|
|
|
+// }
|
|
|
+// }
|
|
|
+// }],
|
|
|
+// series: [
|
|
|
+// {
|
|
|
+// name: '结算率',
|
|
|
+// type: 'line',
|
|
|
+// smooth: true,
|
|
|
+// symbol: 'circle',
|
|
|
+// symbolSize: 5,
|
|
|
+// showSymbol: false,
|
|
|
+// lineStyle: {
|
|
|
+//
|
|
|
+// normal: {
|
|
|
+// color: '#dddc6b',
|
|
|
+// width: 4
|
|
|
+// }
|
|
|
+// },
|
|
|
+// areaStyle: {
|
|
|
+// normal: {
|
|
|
+// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
|
|
|
+// offset: 0,
|
|
|
+// color: 'rgba(221, 220, 107, 0.4)'
|
|
|
+// }, {
|
|
|
+// offset: 0.8,
|
|
|
+// color: 'rgba(221, 220, 107, 0.1)'
|
|
|
+// }], false),
|
|
|
+// shadowColor: 'rgba(0, 0, 0, 0.1)',
|
|
|
+// }
|
|
|
+// },
|
|
|
+// itemStyle: {
|
|
|
+// normal: {
|
|
|
+// color: '#dddc6b',
|
|
|
+// borderColor: 'rgba(221, 220, 107, .1)',
|
|
|
+// borderWidth: 12
|
|
|
+// }
|
|
|
+// },
|
|
|
+// data: [70, 85, 65, 82, 94, 84,88,92,90,88]
|
|
|
+//
|
|
|
+// },
|
|
|
+//
|
|
|
+// ]
|
|
|
+//
|
|
|
+// };
|
|
|
+//
|
|
|
+// // 使用刚指定的配置项和数据显示图表。
|
|
|
+// myChart.setOption(option);
|
|
|
+// window.addEventListener("resize",function(){
|
|
|
+// myChart.resize();
|
|
|
+// });
|
|
|
+// }
|
|
|
|
|
|
- lableLine: {
|
|
|
- normal: {
|
|
|
- show: false
|
|
|
- },
|
|
|
- emphasis: {
|
|
|
- show: true
|
|
|
- }
|
|
|
- },
|
|
|
- data:[
|
|
|
- {value:10, name:'调速电位器'},
|
|
|
- {value:15, name:'外壳及零件'},
|
|
|
- {value:25, name:'热敏开关'},
|
|
|
- {value:30, name:'加热指示灯'},
|
|
|
- {value:35, name:'电池'},
|
|
|
- ]
|
|
|
- },
|
|
|
- ]
|
|
|
- };
|
|
|
|
|
|
- // 使用刚指定的配置项和数据显示图表。
|
|
|
- myChart.setOption(option);
|
|
|
- window.addEventListener("resize",function(){
|
|
|
- myChart.resize();
|
|
|
- });
|
|
|
- }
|
|
|
-function echarts_2() {
|
|
|
- // 基于准备好的dom,初始化echarts实例
|
|
|
- var myChart = echarts.init(document.getElementById('echart2'));
|
|
|
|
|
|
- option = {
|
|
|
- tooltip : {
|
|
|
- trigger: 'item',
|
|
|
- formatter: "{b} : {c} ({d}%)"
|
|
|
- },
|
|
|
- legend: {
|
|
|
- right:10,
|
|
|
- top:30,
|
|
|
- height:140,
|
|
|
- itemWidth:10,
|
|
|
- itemHeight:10,
|
|
|
- itemGap:10,
|
|
|
- textStyle:{
|
|
|
- color: 'rgba(255,255,255,.6)',
|
|
|
- fontSize:12
|
|
|
- },
|
|
|
- orient:'vertical',
|
|
|
- data:['显示屏','维护管','接口接线板','干燥管','电源模块']
|
|
|
- },
|
|
|
- calculable : true,
|
|
|
- series : [
|
|
|
- {
|
|
|
- name:' ',
|
|
|
- color: ['#62c98d', '#205acf', '#c9c862', '#c98b62', '#c962b9', '#7562c9','#c96262'],
|
|
|
- type:'pie',
|
|
|
- radius : [30, 70],
|
|
|
- center : ['35%', '50%'],
|
|
|
- roseType : 'radius',
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- show: true
|
|
|
- },
|
|
|
- emphasis: {
|
|
|
- show: true
|
|
|
- }
|
|
|
- },
|
|
|
|
|
|
- lableLine: {
|
|
|
- normal: {
|
|
|
- show: true
|
|
|
- },
|
|
|
- emphasis: {
|
|
|
- show: true
|
|
|
- }
|
|
|
- },
|
|
|
- data:[
|
|
|
- {value:50, name:'显示屏'},
|
|
|
- {value:45, name:'维护管'},
|
|
|
- {value:35, name:'接口接线板'},
|
|
|
- {value:30, name:'干燥管'},
|
|
|
- {value:28, name:'电源模块'}
|
|
|
- ]
|
|
|
- },
|
|
|
- ]
|
|
|
- };
|
|
|
|
|
|
- // 使用刚指定的配置项和数据显示图表。
|
|
|
- myChart.setOption(option);
|
|
|
- window.addEventListener("resize",function(){
|
|
|
- myChart.resize();
|
|
|
- });
|
|
|
- }
|
|
|
-function echarts_3() {
|
|
|
- var myChart = echarts.init(document.getElementById('echart3'));
|
|
|
|
|
|
- option = {
|
|
|
- tooltip: {
|
|
|
- trigger: 'axis',
|
|
|
- axisPointer: {
|
|
|
- lineStyle: {
|
|
|
- color: '#dddc6b'
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- grid: {
|
|
|
- left: '10',
|
|
|
- top: '20',
|
|
|
- right: '30',
|
|
|
- bottom: '10',
|
|
|
- containLabel: true
|
|
|
- },
|
|
|
|
|
|
- xAxis: [{
|
|
|
- type: 'category',
|
|
|
- boundaryGap: false,
|
|
|
- axisLabel: {
|
|
|
- textStyle: {
|
|
|
- color: "rgba(255,255,255,.6)",
|
|
|
- fontSize:16,
|
|
|
- },
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- lineStyle: {
|
|
|
- color: 'rgba(255,255,255,.1)'
|
|
|
- }
|
|
|
- },
|
|
|
|
|
|
- data: ['模拟考1', '模拟考2', '模拟考3', '模拟考4', '模拟考5', '模拟考6', '模拟考7', '模拟考8', '模拟考9', '模拟考10']
|
|
|
-
|
|
|
- }, {
|
|
|
-
|
|
|
- axisPointer: {show: false},
|
|
|
- axisLine: { show: false},
|
|
|
- position: 'bottom',
|
|
|
- offset: 20,
|
|
|
-
|
|
|
- }],
|
|
|
-
|
|
|
- yAxis: [{
|
|
|
- type: 'value',
|
|
|
- axisTick: {show: false},
|
|
|
- axisLine: {
|
|
|
- lineStyle: {
|
|
|
- color: 'rgba(255,255,255,.1)'
|
|
|
- }
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- textStyle: {
|
|
|
- color: "rgba(255,255,255,.6)",
|
|
|
- fontSize:16,
|
|
|
- },
|
|
|
- },
|
|
|
-
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- color: 'rgba(255,255,255,.1)'
|
|
|
- }
|
|
|
- }
|
|
|
- }],
|
|
|
- series: [
|
|
|
- {
|
|
|
- name: '结算率',
|
|
|
- type: 'line',
|
|
|
- smooth: true,
|
|
|
- symbol: 'circle',
|
|
|
- symbolSize: 5,
|
|
|
- showSymbol: false,
|
|
|
- lineStyle: {
|
|
|
-
|
|
|
- normal: {
|
|
|
- color: '#dddc6b',
|
|
|
- width: 4
|
|
|
- }
|
|
|
- },
|
|
|
- areaStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
|
|
|
- offset: 0,
|
|
|
- color: 'rgba(221, 220, 107, 0.4)'
|
|
|
- }, {
|
|
|
- offset: 0.8,
|
|
|
- color: 'rgba(221, 220, 107, 0.1)'
|
|
|
- }], false),
|
|
|
- shadowColor: 'rgba(0, 0, 0, 0.1)',
|
|
|
- }
|
|
|
- },
|
|
|
- itemStyle: {
|
|
|
- normal: {
|
|
|
- color: '#dddc6b',
|
|
|
- borderColor: 'rgba(221, 220, 107, .1)',
|
|
|
- borderWidth: 12
|
|
|
- }
|
|
|
- },
|
|
|
- data: [70, 85, 65, 82, 94, 84,88,92,90,88]
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- ]
|
|
|
-
|
|
|
-};
|
|
|
-
|
|
|
- // 使用刚指定的配置项和数据显示图表。
|
|
|
- myChart.setOption(option);
|
|
|
- window.addEventListener("resize",function(){
|
|
|
- myChart.resize();
|
|
|
- });
|
|
|
- }
|
|
|
-function echarts_4() {
|
|
|
- // 基于准备好的dom,初始化echarts实例
|
|
|
- var myChart = echarts.init(document.getElementById('echart4'));
|
|
|
-option = {
|
|
|
- tooltip: {
|
|
|
- trigger: 'axis',
|
|
|
- axisPointer: {
|
|
|
- type: 'shadow'
|
|
|
- }
|
|
|
- },
|
|
|
- legend: {
|
|
|
- data: ['2025年'],
|
|
|
- align: 'right',
|
|
|
- right: '40%',
|
|
|
- top:'0%',
|
|
|
- textStyle: {
|
|
|
- color: "#fff",
|
|
|
- fontSize: '16',
|
|
|
-
|
|
|
- },
|
|
|
- itemWidth: 16,
|
|
|
- itemHeight: 16,
|
|
|
- itemGap: 35
|
|
|
- },
|
|
|
- grid: {
|
|
|
- left: '0%',
|
|
|
- top:'40px',
|
|
|
- right: '0%',
|
|
|
- bottom: '2%',
|
|
|
- containLabel: true
|
|
|
- },
|
|
|
- xAxis: [{
|
|
|
- type: 'category',
|
|
|
- data: ['011区队', '012区队', '013区队', '014区队', '015区队', '016区队', '017区队', '018区队', '019区队', '020区队', '021区队', '022区队','023区队', '024区队'],
|
|
|
- axisLine: {
|
|
|
- show: true,
|
|
|
- lineStyle: {
|
|
|
- color: "rgba(255,255,255,.1)",
|
|
|
- width: 1,
|
|
|
- type: "solid"
|
|
|
- },
|
|
|
- },
|
|
|
-
|
|
|
- axisTick: {
|
|
|
- show: false,
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- interval: 0,
|
|
|
- // rotate:50,
|
|
|
- show: true,
|
|
|
- splitNumber: 15,
|
|
|
- textStyle: {
|
|
|
- color: "rgba(255,255,255,.6)",
|
|
|
- fontSize: '16',
|
|
|
- },
|
|
|
- },
|
|
|
- }],
|
|
|
- yAxis: [{
|
|
|
- type: 'value',
|
|
|
- axisLabel: {
|
|
|
- //formatter: '{value} %'
|
|
|
- show:true,
|
|
|
- textStyle: {
|
|
|
- color: "rgba(255,255,255,.6)",
|
|
|
- fontSize: '16',
|
|
|
- },
|
|
|
- },
|
|
|
- axisTick: {
|
|
|
- show: false,
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: true,
|
|
|
- lineStyle: {
|
|
|
- color: "rgba(255,255,255,.1 )",
|
|
|
- width: 1,
|
|
|
- type: "solid"
|
|
|
- },
|
|
|
- },
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- color: "rgba(255,255,255,.1)",
|
|
|
- }
|
|
|
- }
|
|
|
- }],
|
|
|
- series: [{
|
|
|
- name: '2017年',
|
|
|
- type: 'bar',
|
|
|
- data: [87, 99, 85, 82, 86, 94, 86, 82,92, 96, 94, 86, 78,75],
|
|
|
- barWidth:'15', //柱子宽度
|
|
|
- // barGap: 1, //柱子之间间距
|
|
|
- itemStyle: {
|
|
|
- normal: {
|
|
|
- color:'#2f89cf',
|
|
|
- opacity: 1,
|
|
|
- barBorderRadius: 5,
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- // {
|
|
|
- // name: '2018年',
|
|
|
- // type: 'bar',
|
|
|
- // data: [1, 4, 5, 11, 12, 9, 5, 6, 5, 6, 3, 9],
|
|
|
- // barWidth:'15',
|
|
|
- // // barGap: 1,
|
|
|
- // itemStyle: {
|
|
|
- // normal: {
|
|
|
- // color:'#62c98d',
|
|
|
- // opacity: 1,
|
|
|
- // barBorderRadius: 5,
|
|
|
- // }
|
|
|
- // }
|
|
|
- // },
|
|
|
- ]
|
|
|
-};
|
|
|
-
|
|
|
- /* 青岛研锦网络科技有限公司 版权所有*/
|
|
|
- // 使用刚指定的配置项和数据显示图表。
|
|
|
- myChart.setOption(option);
|
|
|
- window.addEventListener("resize",function(){
|
|
|
- myChart.resize();
|
|
|
- });
|
|
|
- }
|
|
|
-function echarts_5() {
|
|
|
- // 基于准备好的dom,初始化echarts实例
|
|
|
- var myChart = echarts.init(document.getElementById('echart5'));
|
|
|
-option = {
|
|
|
- // backgroundColor: '#00265f',
|
|
|
- tooltip: {
|
|
|
- trigger: 'axis',
|
|
|
- axisPointer: {
|
|
|
- // type: 'shadow'
|
|
|
- }
|
|
|
- },
|
|
|
- // legend: {
|
|
|
- // // data: ['2017年', '2018年'],
|
|
|
- // align: 'right',
|
|
|
- // right: '40%',
|
|
|
- // top:'0%',
|
|
|
- // // textStyle: {
|
|
|
- // // color: "#fff",
|
|
|
- // // fontSize: '16',
|
|
|
- // //
|
|
|
- // // },
|
|
|
- //
|
|
|
- // // itemGap: 35
|
|
|
- // },
|
|
|
- grid: {
|
|
|
- left: '0%',
|
|
|
- top:'40px',
|
|
|
- right: '0%',
|
|
|
- bottom: '2%',
|
|
|
- containLabel: true
|
|
|
- },
|
|
|
- xAxis: [{
|
|
|
- type: 'category',
|
|
|
- // data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
|
|
|
- data: ['模拟考1', '模拟考2', '模拟考3', '模拟考4', '模拟考5', '模拟考6', '模拟考7', '模拟考8', '模拟考9', '模拟考10', '模拟考11', '模拟考12'],
|
|
|
- axisLine: {
|
|
|
- show: true,
|
|
|
- lineStyle: {
|
|
|
- color: "rgba(255,255,255,.1)",
|
|
|
- width: 1,
|
|
|
- type: "solid"
|
|
|
- },
|
|
|
- },
|
|
|
- axisTick: {
|
|
|
- show: false,
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- interval: 0,
|
|
|
- // rotate:50,
|
|
|
- show: true,
|
|
|
- splitNumber: 15,
|
|
|
- textStyle: {
|
|
|
- color: "rgba(255,255,255,.6)",
|
|
|
- fontSize: '16',
|
|
|
- },
|
|
|
- },
|
|
|
- }],
|
|
|
- yAxis: [{
|
|
|
- type: 'value',
|
|
|
- axisLabel: {
|
|
|
- //formatter: '{value} %'
|
|
|
- show:true,
|
|
|
- textStyle: {
|
|
|
- color: "rgba(255,255,255,.6)",
|
|
|
- fontSize: '16',
|
|
|
- },
|
|
|
- },
|
|
|
- axisTick: {
|
|
|
- show: false,
|
|
|
- },
|
|
|
- axisLine: {
|
|
|
- show: true,
|
|
|
- lineStyle: {
|
|
|
- color: "rgba(255,255,255,.1 )",
|
|
|
- width: 1,
|
|
|
- type: "solid"
|
|
|
- },
|
|
|
- },
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- color: "rgba(255,255,255,.1)",
|
|
|
- }
|
|
|
- }
|
|
|
- }],
|
|
|
- series: [
|
|
|
- // {
|
|
|
- // name: '2017年',
|
|
|
- // type: 'line',
|
|
|
- //
|
|
|
- // data: [2, 6, 3, 8, 5, 8, 10, 13, 8, 5, 6, 9],
|
|
|
- //
|
|
|
- // itemStyle: {
|
|
|
- // normal: {
|
|
|
- // color:'#2f89cf',
|
|
|
- // opacity: 1,
|
|
|
- //
|
|
|
- // barBorderRadius: 5,
|
|
|
- // }
|
|
|
- // }
|
|
|
- // },
|
|
|
- {
|
|
|
- name: '2018年',
|
|
|
- type: 'line',
|
|
|
- // data: [5, 2, 6, 4, 5, 12, 5, 17, 9, 2, 6, 3],
|
|
|
- data: [70, 85, 65, 82, 94, 84,75,92,70,88,65,89],
|
|
|
- barWidth:'15',
|
|
|
- // barGap: 1,
|
|
|
- itemStyle: {
|
|
|
- normal: {
|
|
|
- color:'#62c98d',
|
|
|
- opacity: 1,
|
|
|
- barBorderRadius: 5,
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- ]
|
|
|
-};
|
|
|
-
|
|
|
-
|
|
|
- // 使用刚指定的配置项和数据显示图表。
|
|
|
- myChart.setOption(option);
|
|
|
- window.addEventListener("resize",function(){
|
|
|
- myChart.resize();
|
|
|
- });
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
-function echarts_6() {
|
|
|
- // 基于准备好的dom,初始化echarts实例
|
|
|
- var myChart = echarts.init(document.getElementById('echart6'));
|
|
|
-
|
|
|
- option = {
|
|
|
- tooltip : {
|
|
|
- trigger: 'item',
|
|
|
- formatter: "{b} : {c} ({d}%)"
|
|
|
- },
|
|
|
- legend: {
|
|
|
- right:10,
|
|
|
- top:30,
|
|
|
- height:140,
|
|
|
- itemWidth:10,
|
|
|
- itemHeight:10,
|
|
|
- itemGap:10,
|
|
|
- textStyle:{
|
|
|
- color: 'rgba(255,255,255,.6)',
|
|
|
- fontSize:12
|
|
|
- },
|
|
|
- orient:'vertical',
|
|
|
- data:['汇总主控板','显控报警板','外壳及零件','检测剂','干燥管']
|
|
|
- },
|
|
|
- calculable : true,
|
|
|
- series : [
|
|
|
- {
|
|
|
- name:' ',
|
|
|
- color: ['#62c98d', '#205acf', '#c9c862', '#c98b62', '#c962b9', '#7562c9','#c96262'],
|
|
|
- type:'pie',
|
|
|
- radius : [30, 70],
|
|
|
- center : ['35%', '50%'],
|
|
|
- roseType : 'radius',
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- show: true
|
|
|
- },
|
|
|
- emphasis: {
|
|
|
- show: true
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- lableLine: {
|
|
|
- normal: {
|
|
|
- show: true
|
|
|
- },
|
|
|
- emphasis: {
|
|
|
- show: true
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- data:[
|
|
|
- {value:50, name:'汇总主控板'},
|
|
|
- {value:45, name:'显控报警板'},
|
|
|
- {value:35, name:'外壳及零件'},
|
|
|
- {value:30, name:'检测剂'},
|
|
|
- {value:30, name:'干燥管'},
|
|
|
- ]
|
|
|
- },
|
|
|
- ]
|
|
|
- };
|
|
|
- // 使用刚指定的配置项和数据显示图表。
|
|
|
- myChart.setOption(option);
|
|
|
- window.addEventListener("resize",function(){
|
|
|
- myChart.resize();
|
|
|
- });
|
|
|
-}
|
|
|
-
|
|
|
-function zb1() {
|
|
|
- // 基于准备好的dom,初始化echarts实例
|
|
|
- var myChart = echarts.init(document.getElementById('zb1'));
|
|
|
- var v1=100//结算数
|
|
|
- var v2=40//未结算数
|
|
|
- var v3=v1+v2//总订单数
|
|
|
-option = {
|
|
|
- series: [{
|
|
|
- type: 'pie',
|
|
|
- radius: ['60%', '70%'],
|
|
|
- color:'#49bcf7',
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- position: 'center'
|
|
|
- }
|
|
|
- },
|
|
|
- data: [{
|
|
|
- value: v1,
|
|
|
- name: '100',
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- formatter:70,//Math.round( v1/v3*100)+ '%%',
|
|
|
- textStyle: {
|
|
|
- fontSize: 30,
|
|
|
- color:'#fff',
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- value: v2,
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- formatter : function (params){
|
|
|
- return '最高分';
|
|
|
- },
|
|
|
- textStyle: {
|
|
|
- color: '#aaa',
|
|
|
- fontSize: 16
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- itemStyle: {
|
|
|
- normal: {
|
|
|
- color: 'rgba(255,255,255,.2)'
|
|
|
- },
|
|
|
- emphasis: {
|
|
|
- color: '#fff'
|
|
|
- }
|
|
|
- },
|
|
|
- }]
|
|
|
- }]
|
|
|
-};
|
|
|
- myChart.setOption(option);
|
|
|
- window.addEventListener("resize",function(){
|
|
|
- myChart.resize();
|
|
|
- });
|
|
|
- }
|
|
|
-function zb2() {
|
|
|
- // 基于准备好的dom,初始化echarts实例
|
|
|
- var myChart = echarts.init(document.getElementById('zb2'));
|
|
|
- var v1=80//结算数
|
|
|
- var v2=20//未结算数
|
|
|
- var v3=v1+v2//总订单数
|
|
|
- option = {
|
|
|
-
|
|
|
-//animation: false,
|
|
|
- series: [{
|
|
|
- type: 'pie',
|
|
|
- radius: ['60%', '70%'],
|
|
|
- color:'#49bcf7',
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- position: 'center'
|
|
|
- }
|
|
|
- },
|
|
|
- data: [{
|
|
|
- value: v1,
|
|
|
- name: '80',
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- // formatter:Math.round( v1/v3*100)+ '%',
|
|
|
- textStyle: {
|
|
|
- fontSize: 24,
|
|
|
- color:'#fff',
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }, {
|
|
|
- value: v2,
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- formatter : function (params){
|
|
|
- return '最低分';
|
|
|
- },
|
|
|
- textStyle: {
|
|
|
- color: '#aaa',
|
|
|
- fontSize: 16
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- itemStyle: {
|
|
|
- normal: {
|
|
|
- color: 'rgba(255,255,255,.2)'
|
|
|
- },
|
|
|
- emphasis: {
|
|
|
- color: '#fff'
|
|
|
- }
|
|
|
- },
|
|
|
- }]
|
|
|
- }]
|
|
|
-};
|
|
|
- myChart.setOption(option);
|
|
|
- window.addEventListener("resize",function(){
|
|
|
- myChart.resize();
|
|
|
- });
|
|
|
- }
|
|
|
-function zb3() {
|
|
|
- // 基于准备好的dom,初始化echarts实例
|
|
|
- var myChart = echarts.init(document.getElementById('zb3'));
|
|
|
- var v1=30//结算金额
|
|
|
- var v2=70//未结算
|
|
|
- var v3=v1+v2
|
|
|
-option = {
|
|
|
- series: [{
|
|
|
-
|
|
|
- type: 'pie',
|
|
|
- radius: ['60%', '70%'],
|
|
|
- color:'#62c98d',
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- position: 'center'
|
|
|
- }
|
|
|
- },
|
|
|
- data: [{
|
|
|
- value: v1,
|
|
|
- name: '95',
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- // formatter:Math.round( v1/v3*100)+ '%',
|
|
|
- textStyle: {
|
|
|
- fontSize: 24,
|
|
|
- color:'#fff',
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }, {
|
|
|
- value: v2,
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- formatter : function (params){
|
|
|
- return '平均分';
|
|
|
- },
|
|
|
- textStyle: {
|
|
|
- color: '#aaa',
|
|
|
- fontSize: 16
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- itemStyle: {
|
|
|
- normal: {
|
|
|
- color: 'rgba(255,255,255,.2)'
|
|
|
- },
|
|
|
- emphasis: {
|
|
|
- color: '#fff'
|
|
|
- }
|
|
|
- },
|
|
|
- }]
|
|
|
- }]
|
|
|
-};
|
|
|
- myChart.setOption(option);
|
|
|
- window.addEventListener("resize",function(){
|
|
|
- myChart.resize();
|
|
|
- });
|
|
|
- }
|
|
|
-function zb4() {
|
|
|
- // 基于准备好的dom,初始化echarts实例
|
|
|
- var myChart = echarts.init(document.getElementById('zb4'));
|
|
|
- var v1=90//结算金额
|
|
|
- var v2=10//未结算
|
|
|
- var v3=v1+v2
|
|
|
-option = {
|
|
|
- series: [{
|
|
|
-
|
|
|
- type: 'pie',
|
|
|
- radius: ['60%', '70%'],
|
|
|
- color:'#29d08a',
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- position: 'center'
|
|
|
- }
|
|
|
- },
|
|
|
- data: [{
|
|
|
- value: v1,
|
|
|
- name: '30分钟',
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- // formatter:Math.round( v1/v3*100)+ '%',
|
|
|
- textStyle: {
|
|
|
- fontSize: 24,
|
|
|
- color:'#fff',
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }, {
|
|
|
- value: v2,
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- formatter : function (params){
|
|
|
- return '平均时长';
|
|
|
- },
|
|
|
- textStyle: {
|
|
|
- color: '#aaa',
|
|
|
- fontSize: 16
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- itemStyle: {
|
|
|
- normal: {
|
|
|
- color: 'rgba(255,255,255,.2)'
|
|
|
- },
|
|
|
- emphasis: {
|
|
|
- color: '#fff'
|
|
|
- }
|
|
|
- },
|
|
|
- }]
|
|
|
- }]
|
|
|
-};
|
|
|
- myChart.setOption(option);
|
|
|
- window.addEventListener("resize",function(){
|
|
|
- myChart.resize();
|
|
|
- });
|
|
|
- }
|
|
|
})
|
|
|
|
|
|
|