function drawLayer02Label(canvasObj, text, textBeginX, lineEndX) {
	var colorValue = '#04918B';
	console.log(1);

	var ctx = canvasObj.getContext("2d");
	ctx.beginPath();
	ctx.arc(35, 55, 2, 0, 2 * Math.PI);
	ctx.closePath();
	ctx.fillStyle = colorValue;
	ctx.fill();
	ctx.moveTo(35, 55);
	ctx.lineTo(60, 80);
	ctx.lineTo(lineEndX, 80);
	ctx.lineWidth = 1;
	ctx.strokeStyle = colorValue;
	ctx.stroke();
	ctx.font = '12px Georgia';
	ctx.fillStyle = colorValue;
	ctx.fillText(text, textBeginX, 92);
}

//接入机型占比

// var COLOR = {
// 	MACHINE: {
// 		TYPE_A: '#0175EE',
// 		TYPE_B: '#D89446',
// 		TYPE_C: '#373693',
// 		TYPE_D: '#25AE4F',
// 		TYPE_E: '#06B5C6',
// 		TYPE_F: '#009E9A',
// 		TYPE_G: '#AC266F'
// 	}
// };

// function renderLegend() {
// 	drawLegend(COLOR.MACHINE.TYPE_A, 25, 'A机型');
// 	drawLegend(COLOR.MACHINE.TYPE_B, 50, 'B机型');
// 	drawLegend(COLOR.MACHINE.TYPE_C, 75, 'C机型');
// 	drawLegend(COLOR.MACHINE.TYPE_D, 100, 'D机型');
// 	drawLegend(COLOR.MACHINE.TYPE_E, 125, 'E机型');
// 	drawLegend(COLOR.MACHINE.TYPE_F, 150, 'F机型');
// 	drawLegend(COLOR.MACHINE.TYPE_G, 175, 'G机型');
// }

// function drawLegend(pointColor, pointY, text) {
// 	var ctx = $("#layer03_left_01 canvas").get(0).getContext("2d");
// 	ctx.beginPath();
// 	ctx.arc(20, pointY, 6, 0, 2 * Math.PI);
// 	ctx.fillStyle = pointColor;
// 	ctx.fill();
// 	ctx.font = '20px';
// 	ctx.fillStyle = '#FEFFFE';
// 	ctx.fillText(text, 40, pointY + 3);
// }


//存储
// function renderLayer03Right(){
// 	drawLayer03Right($("#layer03_right_chart01 canvas").get(0),"#027825",0.66);
// 	drawLayer03Right($("#layer03_right_chart02 canvas").get(0),"#006DD6",0.52);
// 	drawLayer03Right($("#layer03_right_chart03 canvas").get(0),"#238681",0.34);
// }

// function drawLayer03Right(canvasObj,colorValue,rate){
// 	var ctx = canvasObj.getContext("2d");
// 	var circle = {
//         x : 65,    //圆心的x轴坐标值
//         y : 80,    //圆心的y轴坐标值
//         r : 60      //圆的半径
//     };

// 	//画扇形
// 	//ctx.sector(circle.x,circle.y,circle.r,1.5*Math.PI,(1.5+rate*2)*Math.PI);
// 	//ctx.fillStyle = colorValue;
// 	//ctx.fill();

// 	ctx.beginPath();
// 	ctx.arc(circle.x,circle.y,circle.r,0,Math.PI*2)
// 	ctx.lineWidth = 10;
// 	ctx.strokeStyle = '#052639';
// 	ctx.stroke();
// 	ctx.closePath();
// 	ctx.beginPath();
// 	ctx.arc(circle.x,circle.y,circle.r,1.5*Math.PI,(1.5+rate*2)*Math.PI)
// 	ctx.lineWidth = 10;
// 	ctx.lineCap = 'round';
// 	ctx.strokeStyle = colorValue;
// 	ctx.stroke();
// 	ctx.closePath();
// 	ctx.fillStyle = 'white';
// 	ctx.font = '20px Calibri';
// 	ctx.fillText(rate*100+'%',circle.x-15,circle.y+10);

// }


function renderChartBar01() {
	var myChart = echarts.init(document.getElementById("layer03_left_02"));
	myChart.setOption({
		title: {
			text: '111',
			subtext: '',
			x: 'center'
		},
		tooltip: {
			trigger: 'item',
			formatter: "{b} : {c} ({d}%)"
		},
		legend: {
			show: false,
			x: 'center',
			y: 'bottom',
			data: ['A机型', 'B机型', 'C机型', 'D机型', 'E机型', 'F机型', 'G机型']
		},
		toolbox: {

		},
		label: {
			normal: {
				show: true,
				formatter: "{b} \n{d}%"
			}
		},
		calculable: true,
		color: [COLOR.MACHINE.TYPE_A, COLOR.MACHINE.TYPE_B, COLOR.MACHINE.TYPE_C, COLOR.MACHINE.TYPE_D, COLOR.MACHINE.TYPE_E, COLOR.MACHINE.TYPE_F, COLOR.MACHINE.TYPE_G],
		series: [{
			name: '',
			type: 'pie',
			radius: [40, 80],
			center: ['50%', '50%'],
			//roseType : 'area',
			data: [{
					value: 4600,
					name: 'A机型'
				},
				{
					value: 4600,
					name: 'B机型'
				},
				{
					value: 15600,
					name: 'C机型'
				},
				{
					value: 6600,
					name: 'D机型'
				},
				{
					value: 5700,
					name: 'E机型'
				},
				{
					value: 7600,
					name: 'F机型'
				},
				{
					value: 3500,
					name: 'G机型'
				}
			]
		}]
	});

}

/*
function renderChartBar02(){
	var myChart = echarts.init(document.getElementById("layer03_left_03"));
		myChart.setOption(
					{
						title : {
							text: '',
							subtext: '',
							x:'center'
						},
						tooltip : {
							show:true,
							trigger: 'item',
							formatter: "上线率<br>{b} : {c} ({d}%)"
						},
						legend: {
							show:false,
							orient: 'vertical',
							left: 'left',
							data: ['A机型','B机型','C机型','D机型','E机型','F机型','G机型']
						},
						series : [
							{
								name: '',
								type: 'pie',
								radius : '50%',
								center: ['50%', '60%'],
								data:[
									{value:7600, name:'A机型'},
									{value:6600, name:'B机型'},
									{value:15600, name:'C机型'},
									{value:5700, name:'D机型'},
									{value:4600, name:'E机型'},
									{value:4600, name:'F机型'},
									{value:3500, name:'G机型'}
								],
								itemStyle: {
									emphasis: {
										shadowBlur: 10,
										shadowOffsetX: 0,
										shadowColor: 'rgba(0, 0, 0, 0.5)'
									}
								}
							}
						],
						color:[COLOR.MACHINE.TYPE_A,COLOR.MACHINE.TYPE_B,COLOR.MACHINE.TYPE_C,COLOR.MACHINE.TYPE_D,COLOR.MACHINE.TYPE_E,COLOR.MACHINE.TYPE_F,COLOR.MACHINE.TYPE_G]
					}
		);
}*/

function renderLayer04Left() {
	var myChart = echarts.init(document.getElementById("layer04_left_chart"));
	myChart.setOption({
			title: {
				text: '222'
			},
			tooltip: {
				trigger: 'axis'
			},
			legend: {
				data: []
			},
			grid: {
				left: '3%',
				right: '4%',
				bottom: '5%',
				top: '4%',
				containLabel: true
			},
			xAxis: {
				type: 'category',
				boundaryGap: false,
				data: getLatestDays(31),
				axisLabel: {
					textStyle: {
						color: "white", //刻度颜色
						fontSize: 8 //刻度大小
					},
					rotate: 45,
					interval: 2
				},
				axisTick: {
					show: false
				},
				axisLine: {
					show: true,
					lineStyle: {
						color: '#0B3148',
						width: 1,
						type: 'solid'
					}
				}
			},
			yAxis: {
				type: 'value',
				axisTick: {
					show: false
				},
				axisLabel: {
					textStyle: {
						color: "white", //刻度颜色
						fontSize: 8 //刻度大小
					}
				},
				axisLine: {
					show: true,
					lineStyle: {
						color: '#0B3148',
						width: 1,
						type: 'solid'
					}
				},
				splitLine: {
					show: false
				}
			},
			tooltip: {
				formatter: '{c}',
				backgroundColor: '#FE8501'
			},
			series: [{
				name: '',
				type: 'line',
				smooth: true,
				color: colors,
				areaStyle: {
					normal: {
						color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
							offset: 0,
							color: '#026B6F'
						}, {
							offset: 1,
							color: '#012138'
						}], false),
						opacity: 0.2
					}
				},
				itemStyle: {
					normal: {
						color: '#009991'
					},
					lineStyle: {
						normal: {
							color: '#009895',
							opacity: 1
						}
					}
				},
				symbol: 'none',
				data: [48, 52, 45, 46, 89, 120, 110, 100, 88, 96, 88, 45, 78, 67, 89, 103, 104, 56, 45, 104, 112, 132, 120, 110, 89, 95, 90, 89, 102, 110, 110]
			}]
		}

	);
}

// function renderLayer04Right(){
// 	console.log(3);

// 	var myChart = echarts.init(document.getElementById("layer04_right_chart"));
// 	myChart.setOption({
// 			title: {
// 				text: '333'
// 			},
// 			tooltip: {
// 				trigger: 'axis'
// 			},
// 			legend: {
// 				top:20,
// 				right:5,
// 				textStyle:{
// 					color:'white'
// 				},
// 				orient:'vertical',
// 				data:[
// 						{name:'网络',icon:'circle'},
// 						{name:'内存',icon:'circle'},
// 						{name:'CPU',icon:'circle'}
// 					]
// 			},
// 			grid: {
// 				left: '3%',
// 				right: '16%',
// 				bottom: '3%',
// 				top:'3%',
// 				containLabel: true
// 			},
// 			xAxis: {
// 				type: 'category',
// 				boundaryGap: false,
// 				axisTick:{show:false},
// 				axisLabel:{
// 					textStyle:{
// 						color:"white", //刻度颜色
// 						fontSize:8  //刻度大小
// 						}
// 				},
// 				axisLine:{
// 					show:true,
// 					lineStyle:{
// 						color: '#0B3148',
// 						width: 1,
// 						type: 'solid'
// 					}
// 				},
// 				data: get10MinutesScale()
// 			},
// 			yAxis: {
// 				type: 'value',
// 				axisTick:{show:false},
// 				axisLabel:{
// 					textStyle:{
// 						color:"white", //刻度颜色
// 						fontSize:8  //刻度大小
// 						}
// 				},
// 				axisLine:{
// 					show:true,
// 					lineStyle:{
// 						color: '#0B3148',
// 						width: 1,
// 						type: 'solid'
// 					}
// 				},
// 				splitLine:{
// 					show:false
// 				}
// 			},
// 			series: [
// 						{
// 							name:'网络',
// 							type:'line',
// 							itemStyle : {  
// 									normal : {  
// 									color:'#F3891B'
// 								},
// 								lineStyle:{
// 									normal:{
// 									color:'#F3891B',
// 									opacity:1
// 										}
// 								}
// 							},  
// 							data:[120, 132, 101, 134, 90, 230, 210]
// 						},
// 						{
// 							name:'内存',
// 							type:'line',
// 							itemStyle : {  
// 									normal : {  
// 									color:'#006AD4'
// 								},
// 								lineStyle:{
// 									normal:{
// 									color:'#F3891B',
// 									opacity:1
// 										}
// 								}
// 							},
// 							data:[220, 182, 191, 234, 290, 330, 310]
// 						},
// 						{
// 							name:'CPU',
// 							type:'line',
// 							itemStyle : {  
// 									normal : {  
// 									color:'#009895'
// 								},
// 								lineStyle:{
// 									normal:{
// 									color:'#009895',
// 									opacity:1
// 										}
// 								}
// 							},
// 							data:[150, 232, 201, 154, 190, 330, 410]
// 						}
// 					]
// 		}	
// 	);
// }

function get10MinutesScale() {
	var currDate = new Date();
	var odd = currDate.getMinutes() % 10;
	var returnArr = new Array();
	currDate.setMinutes(currDate.getMinutes() - odd);
	for (var i = 0; i < 7; i++) {
		returnArr.push(currDate.getHours() + ":" + (currDate.getMinutes() < 10 ? ("0" + currDate.getMinutes()) : currDate.getMinutes()));
		currDate.setMinutes(currDate.getMinutes() - 10);
	}
	return returnArr;
}


function getLatestDays(num) {
	var currentDay = new Date();
	var returnDays = [];
	for (var i = 0; i < num; i++) {
		currentDay.setDate(currentDay.getDate() - 1);
		returnDays.push((currentDay.getMonth() + 1) + "/" + currentDay.getDate());
	}
	return returnDays;
}


// 左1

var colors = ['#00afff', '#ff5654', '#fec100', '#9fff92', '#56dc2b', ]

function renderLayerleft1(data) {
	let seriesdata = eval(data.resourceclassSeries)

	var myChart = echarts.init(document.getElementById("layer03_right_chart01"));
	myChart.setOption({
			tooltip: {
				trigger: 'item',
				formatter: "{b} : {c} ({d}%)"
			},
			legend: {
				show: false

			},
			toolbox: {
				show: false,

			},
			calculable: true,
			series: [{
				name: '访问来源',
				type: 'pie',
				color: colors,

				radius: ['50%', '70%'],
				itemStyle: {
					normal: {
						label: {
							show: false
						},
						labelLine: {
							show: false
						}
					},
					emphasis: {
						label: {
							show: false,
							position: 'center',
							textStyle: {
								fontSize: '30',
								fontWeight: 'bold'
							}
						}
					}
				},
				data: seriesdata
			}]
		}

	)
}
// 左2
function renderLayerleft2(data) {
	let seriesdata = eval(data.shenhezhuangtaiSeries)["0"].seriesData
	var myChart = echarts.init(document.getElementById("layer03_right_chart02"));
	myChart.setOption({
			tooltip: {
				trigger: 'item',
				formatter: "{b} : {c} ({d}%)"
			},
			legend: {
				show: false

			},
			toolbox: {
				show: false,

			},
			calculable: true,
			series: [{
				name: '',
				type: 'pie',
				radius: ['50%', '70%'],
				color: colors,

				itemStyle: {
					normal: {
						label: {
							show: false
						},
						labelLine: {
							show: false
						}
					},
					emphasis: {
						label: {
							show: false,
							position: 'center',
							textStyle: {
								fontSize: '30',
								fontWeight: 'bold'
							}
						}
					}
				},
				data: seriesdata
			}]
		}

	)
}
// 左3
function renderLayerleft3(data) {
	let seriesdata = eval(data.sharprotocolSeries)["0"].seriesData

	var myChart = echarts.init(document.getElementById("layer03_right_chart03"));
	myChart.setOption({
			tooltip: {
				trigger: 'item',
				formatter: "{b} : {c} ({d}%)"
			},
			legend: {
				show: false

			},
			toolbox: {
				show: false,

			},
			calculable: true,
			series: [{
				name: '',
				type: 'pie',
				color: colors,
				radius: ['50%', '70%'],
				itemStyle: {
					normal: {
						label: {
							show: false
						},
						labelLine: {
							show: false
						}
					},
					emphasis: {
						label: {
							show: false,
							position: 'center',
							textStyle: {
								fontSize: '30',
								fontWeight: 'bold'
							}
						}
					}
				},
				data: seriesdata
			}]
		}

	)
}


// 最左侧折线图

function renderLayerleft(data) {
	let seriesdata = eval(data.MuLuSeries)
	let lengenddata = eval(data.MuLuLegends)
	
	var myChart = echarts.init(document.getElementById("layer03_left_01"));
	myChart.setOption({
			legend: {
				show: false,
				// data: ['高度(km)与气温(°C)变化关系']
			},
			toolbox: {
				show: false,

			},
			calculable: true,
			tooltip: {
				trigger: 'axis',
				// formatter: "Temperature : <br/>{b}km : {c}°C"
			},

			xAxis: [{
				type: 'category',
				data:lengenddata,

				axisLabel: {
					color: "#fff", //30eee9
					rotate:40
					// formatter: '{value} °C'
				},
				axisLine: {
					show: true, //x轴线颜色
					lineStyle: {
						color: "#5d7289"
					},

				},


			}],
			yAxis: [{
				type: 'value',
				axisLine: {
					onZero: false
				},
				axisLabel: {
					color: "#fff", //30eee9

					// formatter: '{value} km'
				},
				axisLine: {
					show: true, //x轴线颜色
					lineStyle: {
						color: "#5d7289"
					},

				},
				boundaryGap: false,
			}],
			series: [{
				name: '资源数量',
				type: 'line',
				smooth: true,
				itemStyle: {
					normal: {
						lineStyle: {
							color: '#1282ff',
							shadowColor: '#1282ff'
						},
						color: '#1282ff',
						
					}
				},
				data: seriesdata
			}]
		}

	)
}