$(function(){
	//湿地综合效益价值
	var benefitEchart = echarts.init(document.getElementById("benefitEchart"));
	//监测概况
	var surveyEchart = echarts.init(document.getElementById("surveyEchart"));
	//湿地公园数量
	var areaNumber = echarts.init(document.getElementById("areaNumber"));
	//各类型湿地占比
	var areaProportion = echarts.init(document.getElementById("areaProportion"));
	$(".tes").show();
	echartsShow(areaNumber, areaProportion, benefitEchart);
	surveyData(surveyEchart);
	$(".main-acreage-list").mCustomScrollbar("destroy");
	$(".main-acreage-list").mCustomScrollbar();
	
	$(".main-acreage .main-title i").click(function(){
		$(".main-acreage-list").hide();
		$("#areaRatio").hide();
		$(this).addClass('on').siblings().removeClass('on');
		if($(this).html() == "各区市湿地面积"){
			$(".main-acreage-list").show();
		}else if($(this).html() == "全省湿地面积"){
			$("#areaRatio").show();
			$("#areaRatio").css({"width":$(".main-acreage").width() +"px", "height":$(".main-acreage").height()-15 +"px"});
			areaTatioShow();
		}
	});
	
	function surveyData(surveyEchart){
		$.ajax({
			url:getNativePath() + "naturalFactors/queryMonitorElements.do",
			type:"get",
			dataType:"json",
			success:function(result){
				var myGraphData = [{ "parentNode":"湿地生态监测模型", "childNodes":["气象要素", "空气环境要素", "水文与水环境要素", "土壤要素"]}];
				var sd1 = [];
				$(".tes").hide();
				var dataVal = result.data[0];
//				console.log(dataVal)
				var datas = [{ "name":"湿地生态监测模型", "childNodes":["气象要素", "空气环境要素", "水文与水环境要素", "土壤要素"], "color":"#369105"}];
				for(var k in dataVal){
//					console.log(dataVal[k])
					if(k == "MonitorElementsTotal"){
						$("#elemcount").html(dataVal[k]);
					}else if(k == "stationTotal"){
						$("#stacount").html(dataVal[k]);
					}else if(k == "videoTotal"){
						$("#videoTotal").html(dataVal[k]);
					}else{
						var sk = dataVal[k].split(",");
						if(k == "T_DATA_WEATHER"){
							datas.push({"name":"气象要素", "dataChild":sk, "color":"#a5a5a5"});
							myGraphData.push({ "parentNode":"气象要素", "childNodes":sk , "color":"#a5a5a5"});
						}else if(k == "T_DATA_AIR"){
							datas.push({"name":"空气环境要素", "dataChild":sk, "color":"#4472c5"});
							myGraphData.push({ "parentNode":"空气环境要素", "childNodes":sk , "color":"#4472c5" });
						}else if(k == "T_DATA_WATER"){
							datas.push({"name":"水文与水环境要素", "dataChild":sk, "color":"#ffc100"});
							myGraphData.push({ "parentNode":"水文与水环境要素", "childNodes":sk , "color":"#ffc100" });
						}else if(k == "T_DATA_SOIL"){
							datas.push({"name":"土壤要素", "dataChild":sk, "color":"#ed7c30"});
							myGraphData.push({ "parentNode":"土壤要素", "childNodes":sk , "color":"#ed7c30" });
						}
					}
				}
				
				function setNodeData(arr, m, n ,listdata) {
				    var size = 15;
				    for(var i=0; i<arr.length; i++){
				    	for(var k in datas){
				    		size = 15;
					    	if(arr[i] == datas[k].name){
					    		if(datas[k].name == "湿地生态监测模型"){
					    			size = 25;
					    		}else{
					    			size = 15;
					    		}
					    		listdata.push({
						            id : m++,
						            category: n,
						            itemStyle:{color:datas[k].color},
						            label:{
							            	color:"#fff"
							            },
						            name: arr[i],
						            symbolSize: size,
						            draggable: "true"
						       });
					    	}
					    	for(var s in datas[k].dataChild){
					        	if(arr[i] == datas[k].dataChild[s]){
					        		listdata.push({
							            id : m++,
							            category: n,
							            itemStyle:{color:datas[k].color},
							            label:{
							            	color:"#f7efef"
							            },
							            name: arr[i],
							            symbolSize: size,
							            draggable: "true"
							       });
					        	}
					        }
				    	}
				    }
				}
				
				function setLinkData(sourceList, m, links) {
				    for(var i=0; i<sourceList.length; i++){
				    	for(var k in sData){
				    		for(var s in sData[k].datas){
				    			if(sourceList[i] == sData[k].datas[s]){
				    				links.push({
							            "source": sourceList[i],
							            "target": m,
							            lineStyle: {
							                normal: {
							                    color: sData[k].color
							                }
							            }
							        })
				    			}
				    		}
				    	}
				    }
				} 
				var listdata = [];
				var linksdata = [];     
				var sData = [];
				var nodeData = myGraphData;
				var m = 0;
				var source = [];
				var dataColor = ["#369105", "#a5a5a5", "#4472c5", "#ffc100", "#ed7c30"];
				for(var i=1; i < nodeData.length; i++){
				    var node = nodeData[i].parentNode;
				    var tx = [node];
				    setNodeData(tx, m, 1, listdata);
				    source.push(m);
				
				    var Data = nodeData[i].childNodes;
				    setNodeData( Data, m+1, 2, listdata);
				
				    var sourceList = [];
				    for(var n = m+1; n < m + Data.length + 1; n++){
				        sourceList.push(n);
				    }
				    sData.push({"datas":sourceList, "color":dataColor[i]});
				    setLinkData( sourceList, m, linksdata);
				    m = m + Data.length + 1;
				}     
				var tx7 = [];
				sData.push({"datas":source, "color":dataColor[0]});
				tx7.push(nodeData[0].parentNode);
				setNodeData(tx7, m, 0, listdata);
				setLinkData(source, m, linksdata);
				var repulsion = 40;
				if($("#surveyEchart").height() > 240){
					repulsion = 60;
				}else if($("#surveyEchart").height() > 220 && $("#surveyEchart").height() < 240){
					repulsion = 50;
				}else{
					repulsion = 40;
				}
				
				
				var surveyOption = {
				    tooltip: {
				        formatter:function(param){
				        	for(var k in datas){
				        		if(param.name == datas[k].name){
				        			return param.name;
				        		}
				        		for(var s in datas[k].dataChild){
				        			if(param.name == datas[k].dataChild[s]){
					        			return param.name;
					        		}
				        		}
				        	}
				        	
				        }
				    },
				    animationDuration: 0,
				    animationEasingUpdate: 'quinticInOut',
				    series: [{
				        name: '',
				        type: 'graph',
				        layout: 'force',
				        force: {
				            repulsion: repulsion,
				            gravity: 0.1,
				            edgeLength: [10, 50],
				            layoutAnimation: true,
				        },
				        data: listdata,
				        links: linksdata,
				        roam: true,
				        label: {
				            normal: {
				                show: true,
				                position: 'bottom',
				                formatter: '{b}',
				                fontSize: 10,
				                fontStyle: '600',
				            }
				        },
				        lineStyle: {
				            normal: {
				                opacity: 0.9,
				                width: 1.5,
				                curveness: 0
				            }
				        }
				    }]
				};
				
				surveyEchart.setOption(surveyOption);	
				$(window).resize(surveyEchart.resize);
			}
		});
		/*var pieces = [
					{value: 0, label: "Level 0"},
					{value: 1, label: "Level 1"},
					{value: 2, label: "Level 2"}
				];
    	
    	$(".tes").hide();
		$.ajax({
			url:getNativePath() + "naturalFactors/queryMonitorElements.do",
			type:"get",
			dataType:"json",
			success:function(result){
				var dataVal = result.data[0];
				var rawData = [{id: "flare", value: ""}];
				var seriesData = [[1000, 0, "flare", '']];
				for(var k in dataVal){
					if(k == "MonitorElementsTotal"){
						$("#elemcount").html(dataVal[k]);
					}else if(k == "stationTotal"){
						$("#stacount").html(dataVal[k]);
					}else{
						rawData.push({id: "flare."+k, value: "5"});
						if(k == "T_DATA_WEATHER"){
							seriesData.push([5, 1, "flare."+k, '气象要素']);
						}else if(k == "T_DATA_AIR"){
							seriesData.push([5, 1, "flare."+k, '空气环境要素']);
						}else if(k == "T_DATA_WATER"){
							seriesData.push([5, 1, "flare."+k, '水文与水环境要素']);
						}else if(k == "T_DATA_SOIL"){
							seriesData.push([5, 1, "flare."+k, '土壤要素']);
						}
						
						var sk = dataVal[k].split(",");
						for(var i=0; i<sk.length; i++){
							rawData.push({id: "flare."+k+".s"+i, value: "5"});
							seriesData.push([5, 2, "flare."+k+".s"+i, sk[i]]);
						}
					}
				}
				
				var stratify = d3.stratify().parentId(function(d) { return d.id.substring(0, d.id.lastIndexOf(".")); });
    			var root = stratify(rawData).sum(function(d) { return d.value;}).sort(function(a, b) { return b.value - a.value;});
    			function renderItem(params, api) {
		        var context = params.context;
		        if (!context.layout) {
		            d3.pack().size([api.getWidth() - 2, api.getHeight() - 2]).padding(3)(root);
		            context.layout = {};
		            root.descendants().forEach(function (node) {
		                context.layout[node.id] = {
		                    x: node.x,
		                    y: node.y,
		                    r: node.r,
		                    isLeaf: !node.children || !node.children.length
		                };
		            });
		        }
		
		        var nodePath = api.value(2);
		        var itemLayout = context.layout[nodePath];
		        var nodeName = '';
		        var textFont = api.font({
		            fontSize: 0,
		            fontFamily: 'Arial'
		        });
				
		        if (itemLayout.isLeaf && itemLayout.r > 10) {
		            nodeName = nodePath.slice(nodePath.lastIndexOf('.') + 1).split(/(?=[A-Z][^A-Z])/g).join('\n');
		            
		            nodeName = echarts.format.truncateText("", itemLayout.r, textFont, '.');
		        }
		        return {
		            type: 'circle',
		            shape: {
		                cx: itemLayout.x,
		                cy: itemLayout.y,
		                r: itemLayout.r
		            },
		            z2: api.value(1) * 2,
		            style: api.style({
		                text: nodeName,
		                textFont: textFont,
		                textPosition: 'inside'
		            }),
		            styleEmphasis: api.style({
		                text: nodeName,
		                textPosition: 'inside',
		                textFont: textFont,
		                stroke: 'rgba(255,255,255,0.5)',
		                lineWidth: 3
		            })
		        };
		    }
				var surveyOption = {
			        xAxis: {
			            axisLine: {show: false},
			            axisTick: {show: false},
			            axisLabel: {show: false},
			            splitLine: {show: false}
			        },
			        yAxis: {
			            axisLine: {show: false},
			            axisTick: {show: false},
			            axisLabel: {show: false},
			            splitLine: {show: false}
			        },
			        tooltip: {
			        	formatter:function(params){
			        		var html = params.data[3];
	    			 		return html;
	    			 	}
			        },
			        visualMap: {
			            show: false,
			            type: 'piecewise',
			            bottom: 40,
			            pieces: pieces,
			            dimension: 1,
			            inRange: {
			                color: ['#3f7aa0', '#75a6c5', '#bbeed6']
			            }
			        },
			        series: {
			            type: 'custom',
			            renderItem: renderItem,
			            encode: {
			                tooltip: 0,
			                itemName: 2
			            },
			            data: seriesData
			        }
			    };
			    surveyEchart.setOption(surveyOption);	
				$(window).resize(surveyEchart.resize);
			}
		});*/
		/*$.ajax({
			url:getNativePath() + "station/findStationCount.do",
			type:"get",
			dataType:"json",
			success:function(result){
				//console.log(result)
				$(".tes").hide();
				$("#stacount").html(result.stacount);
				$("#elemcount").html(result.elemcount);
				
				var titlename = ['优', '良', '一般', '较差', '差'];
				
				var valdata = [result.youcount, result.liangcount, result.yibancount, result.jiaochacount, result.chacount];
				var max = max(valdata);
				//console.log(max)
				var data = [
				(result.youcount/max).toFixed(2)*100, 
				(result.liangcount/max).toFixed(2)*100, 
				(result.yibancount/max).toFixed(2)*100, 
				(result.jiaochacount/max).toFixed(2)*100, 
				(result.chacount/max).toFixed(2)*100
				];
				var myColor = ['#63e2a2', '#18cfaf', '#f4d152', '#fca801', '#e3607d'];
				var surveyOption = {
					    title: {
					        text:'湿\n地\n生\n态\n状\n况',
					        left:'10',
					        y:'center',
					        textStyle:{
					          color:'#fff',
					          fontSize:14,
					          align:'center'
					        }
					      },
					      grid: {bottom: '4%', top:'0', left:'80'},
					    xAxis: {
					        show: false
					    },
					    yAxis: [{
					        show: true,
					        data: titlename,
					        inverse: true,
					        offset:5,
					        axisLine: {
					            show: false
					        },
					        splitLine: {
					            show: false
					        },
					        axisTick: {
					            show: false
					        },
					        axisLabel: {
					            color: '#fff'
					        },
					    }, {
					        show: true,
					        inverse: true,
					        data: valdata,
					        axisLabel: {
					            textStyle: {
					                fontSize: 12,
					                color: '#fff',
					            },
					        },
					        axisLine: {
					            show: false
					        },
					        splitLine: {
					            show: false
					        },
					        axisTick: {
					            show: false
					        },
					
					    }],
					    series: [{
					        name: '条',
					        type: 'bar',
					        yAxisIndex: 0,
					        data: data,
					        barWidth: 8,
					        itemStyle: {
					            normal: {
					                barBorderRadius: 30,
					                color: function(params) {
					                    var num = myColor.length;
					                    return myColor[params.dataIndex % num]
					                },
					            }
					        },
					        label: {
					            normal: {
					                show: true,
					                position: 'inside',
					                formatter: '{c}%'
					            }
					        },
					    }, {
					        name: '框',
					        type: 'bar',
					        yAxisIndex: 1,
					        data: [100, 100, 100, 100, 100],
					        barWidth: 10,
					        itemStyle: {
					            normal: {
					                color: 'none',
					                borderColor: '#00c1de',
					                borderWidth: 1,
					                barBorderRadius: 15,
					            }
					        }
					    }, ]
					};
				
				surveyEchart.setOption(surveyOption);	
				$(window).resize(surveyEchart.resize);
				
				function max(arr){
			        var num = arr[0];
			        for(var i=0;i<arr.length; i++){
			            if(num < arr[i]){
			                num = arr[i]
			            }
			        }
			        return num;
			    }
			}
		});*/
	}
	
	
	
	function areaTatioShow(){
		//全省湿地面积占国土面积比例
		var areaRatio = echarts.init(document.getElementById("areaRatio"));
		//*********  全省湿地面积占国土面积比例       环形图 **********
		var colors=['#f6909e','#83dce7','#fad797','#59ccf7','#c3b4df'];
		var spotOption = {
			tooltip: {
		        trigger: 'item',
		        formatter: "{b}: {c}"
	    	},
	    	 title: {
		        text:'5.45%\n占比',
		        left:'center',
		        top:'45%',
		        textStyle:{
		          color:'#fff',
		          fontSize:20,
		          align:'center'
		        }
		      },
	    	grid: {bottom: '1%'},
		    legend: {
		    	top:'13%',
		        orient: 'horizontal',
		        data:['全省国土面积', '全省湿地面积'],
		        textStyle : {color:'#fff'},
		        itemWidth:14
		    },
		    series: [
		        {
		            type:'pie',
		            radius: ['36%', '48%'],
		            center: ['50%', '55%'],
		            avoidLabelOverlap: false,
		            data:[ 
			            	{value:1669, name:'全省国土面积',itemStyle:{
				                color: {
				                    type: 'linear', x: 0, y: 0, x2: 1, y2: 1,
				                    colorStops: [
				                     	{offset: 0.2, color: '#63dbe2'},
				                    	{offset: 1, color: '#097bcc'}],
				                    globalCoord: true // 缺省为 false
				                }
				            },
				            labelLine:{
				            	show:true,
				            	length:0,
				            	length2:45
				            },
			            	label: {
				            	formatter: '{title|{c}}{abg|万公顷}\n{hr|}\n{b|{b}}',
				            	rich: {
				            		title: {
	                                    color: '#67e0e3',
	                                    fontSize:'24',
	                                    fontWeight: 'bold'
	                                },
	                                abg:{
	                                	color: '#67e0e3',
	                                	padding: [0, 0, 6, 0]
	                                },
				            	 	hr: {
			                            borderColor: '#67e0e3',
			                            width: '100%',
			                            borderWidth: 1,
			                            height: 0
			                        },
			                        b:{
			                        	color: '#fff',
			                        	lineHeight: 25,
			                        	align:'left'
			                        }
				            	 }
				            }},
				            {value:91.01, name:'全省湿地面积',
			            	itemStyle:{
				                color: {
				                    type: 'linear', x: 0, y: 0, x2: 1, y2: 1,
				                    colorStops: [
				                     	{offset: 0.2, color: '#fdd001'},
				                    	{offset: 1, color: '#fda501'}],
				                    globalCoord: true // 缺省为 false
				                }
				            },
				            labelLine:{
				            	show:true,
				            	length:0,
				            	length2:45
				            },
			            	label: {
				            	formatter: '{title|{c}}{abg|万公顷}\n{hr|}\n{b|{b}}',
				            	rich: {
				            		title: {
	                                    color: '#fdb628',
	                                    fontSize:'24',
	                                    fontWeight: 'bold'
	                                },
	                                abg:{
	                                	color: '#fdb628',
	                                	padding: [0, 0, 6, 0]
	                                },
				            	 	hr: {
			                            borderColor: '#fdb628',
			                            width: '100%',
			                            borderWidth: 1,
			                            height: 0
			                        },
			                        b:{
			                        	color: '#fff',
			                        	lineHeight: 25,
			                        	align:'left'
			                        }
				            	 }
				            }}
			            ]
		        }
		    ]
		};
		areaRatio.clear();	
		areaRatio.setOption(spotOption);	
		$(window).resize(areaRatio.resize);
	}

	function echartsShow(areaNumber, areaProportion, benefitEchart){ // 图表初始化
		//*********  湿地公园数量     柱图   **********
		var areaOption1 = {
		    grid:{
	        	top:34,
	        	bottom:30,
	            left:25,
	            right:2
	        },
		    legend: {
		    	orient: 'horizontal',
		        data:['国家级 : 39','省级 : 60'],
			    tooltip: {
			        show: true
			    },
		        right:10,
		        top:5,
		        textStyle : {color:'#fff'},
		        itemWidth:0,
		        itemHeight:0
		    },
		     
		    xAxis: [
		        {
		            type: 'category',
		            axisTick: {alignWithLabel: true},
	            	nameTextStyle:{color:'#137b82'},
	            	splitLine:{show: false},
	            	axisLabel: {
	            		interval:0,
			            textStyle: {
			                color: '#169e93'
			            }
	       			 },
		            axisLine:{
		            	lineStyle:{color:'#1ad0ad',width:'2'}
		            },
		            data: ['赣州','抚州','上饶','吉安','九江','宜春','萍乡','鹰潭','新余','景德镇','南昌'],
		            axisPointer: {
		                type: 'shadow'
		            }
		        }
		    ],
		    yAxis: [
		        {
		            type: 'value',
		            name: '',
		            min: 0,
		            max: 16,
		            interval: 4,
		            axisLine:{
		            	lineStyle:{color:'#2264b5', width:'0'}
		           	},
			    	nameTextStyle:{color:'#169f94'},
			    	axisLabel: {
				            textStyle: {
				                color: '#169f94'
				            }
		       			 },
			    	splitLine:{
			    		lineStyle:{color:'#147c82'},
			    		interval:false
			    	}
		        }
		    ],
		    tooltip: {
             	trigger: 'axis', 
              	formatter: function(datas){
                  	var res = datas[0].axisValue + '<br/>', val;
                  	for(var i = 0, length = datas.length; i < length; i++) {
                    	val = (datas[i].value);
                    	if(i){
                    		res +=  '省级：' + val + '<br/>';
                    	}else{
                    		res +=  '国家级：' + val + '<br/>';
                    	}
                   	}
                    return res;
               	}
          	},
		    series: [
		        {
		            name:'国家级 : 39',
		            type:'bar',
		            data:[13, 6, 5, 5, 3, 2, 2, 1, 1, 1, 0],
		            itemStyle: {
			        normal: {
			            color: new echarts.graphic.LinearGradient(
			                0, 0, 0, 1,
			                [
			                    {offset: 0, color: '#fed701'},
			                    {offset: 0.5, color: '#fdb701'},
			                    {offset: 1, color: '#fc9701'}
			                ]
			            )
			        }
		        }},
		        {
		            name:'省级 : 60',
		            type:'bar',
		            data:[7, 11, 7, 5, 9, 9, 2, 4, 1, 3, 2],
		            itemStyle: {
		            normal: {
			            color: new echarts.graphic.LinearGradient(
			                0, 0, 0, 1,
			                [
			                    {offset: 0, color: '#64dde3'},
			                    {offset: 0.5, color: '#2daae0'},
			                    {offset: 1, color: '#0585de'}
			                ]
			            )
			        }
		        }}
		    ]
		};
		
		areaNumber.setOption(areaOption1);	
		$(window).resize(areaNumber.resize);
		//*********  各类型湿地占比    嵌套环形图   **********
//		if($(".main-area-legend").height() > $(".main-area-table").height()){
//			$(".main-area-table").css({"position":"relative", "top":"50%", "transform":"translateY(-50%)"});
//		}else{
//			$(".main-area-table").css({"position":"static", "top":"auto", "transform":"translateY(0)"});
//			$(".main-area-legend").mCustomScrollbar();
//		}
		var colorArea = ["#6495ed", "#d9d0a9", "#ca8622", "#dd6b66", "#2F4F4F", "#7289ab", "#8ed1e8", "#808000", "#6495ED", "#c4ccd3", "#af89d6", "#91c7ae"];
		$(".main-area-table span").each(function(index){
			$(this).css({"background":colorArea[index]});
		});
		var areaPro = {
			color:['#fff'],
		    tooltip: {
		        trigger: 'item',
		        formatter: "{b}: {c} ({d}%)"
		    },
		    legend: {
		    	show:false,
		    	top:"center",
		    	left:"0",
		    	align:"left",
		        type:'scroll',
		        orient: 'vertical',
		        //data:['河流湿地','永久性河流', '洪泛平原湿地','人工湿地', '库塘', '运河、输水河', '水产养殖厂', '沼泽湿地','草木沼泽','湖泊湿地', '季节性淡水湖', '永久性淡水湖泊'],
		        data:[
		        	{
		        		name:'河流湿地',
		        		textStyle:{
		        			fontWeight:'bold',
		        			color:'#e2aa5f',
		        			fontSize:'14'
		        		}
		        	},
		        	{
		        		name:'永久性河流'
		        	},
		        	{
		        		name:'洪泛平原湿地'
		        	},
		        	{
		        		name:'人工湿地',
		        		textStyle:{
		        			fontWeight:'bold',
		        			color:'#e2aa5f',
		        			fontSize:'14'
		        		}
		        	},
		        	{
		        		name:'库塘'
		        	},
		        	{
		        		name:'运河、输水河'
		        	},
		        	{
		        		name:'水产养殖厂'
		        	},
		        	{
		        		name:'沼泽湿地',
		        		textStyle:{
		        			fontWeight:'bold',
		        			color:'#e2aa5f',
		        			fontSize:'14'
		        		}
		        	},
		        	{
		        		name:'草木沼泽'
		        	},
		        	{
		        		name:'湖泊湿地',
		        		textStyle:{
		        			fontWeight:'bold',
		        			color:'#e2aa5f',
		        			fontSize:'14'
		        		}
		        	},
		        	{
		        		name:'季节性淡水湖'
		        	},
		        	{
		        		name:'永久性淡水湖泊'
		        	}
		        ],
		        textStyle : {color:'#fff'},
		        pageTextStyle:{color:'#fff'},
		        pageIconColor:'#fff',
		        pageIconInactiveColor:'#fff',
		        itemWidth:10,
		        formatter: function (name) {
		        	if(name == "河流湿地" || name == "人工湿地" || name == "沼泽湿地" || name == "湖泊湿地"){
		        		return name;
		        	}else{
		        		return "  "+name;
		        	}
		        	
		        }
		    },
		    series: [
		        {
		            name:'访问来源',
		            type:'pie',
		            selectedMode: 'single',
		            radius: ['25%', '50%'],
		            center: ['50%', '50%'],
					color:["#dd6b66", "#6495ed", "#af89d6", "#8ed1e8"],
		            label: {
		                normal: {
		                	 show: false,
		                    position: 'inner'
		                }
		            },
		            labelLine: {
		                normal: {
		                    show: false
		                }
		            },
		            data:[
		                {value:310747.1, name:'河流湿地'},
		                {value:374090.9, name:'湖泊湿地'},
		                {value:25827.1, name:'沼泽湿地'},
		                {value:199394.1, name:'人工湿地'}
		            ]
		        },
		        {
		            name:'访问来源',
		            type:'pie',
		            radius: ['50%', '92%'],
		            center: ['50%', '50%'],
		            label: {
		            	normal: {
		            		show: false,
			                position: 'inner',
			                formatter: '{d}%',
			
			                textStyle: {
			                    color: '#fff',
			                    fontSize: 12
			                }
			            }
			        },
			        labelLine: {
			            normal: {
			                show: false
			            }
			        },
			        color: ['#2F4F4F', '#7289ab', '#d9d0a9', '#ca8622', '#91c7ae', '#808000', '#6495ED', "#c4ccd3"],
		            data:[
		                {value:270327.1, name:'永久性河流'},
		                {value:40420, name:'洪泛平原湿地'},
						{value:374003.8, name:'永久性淡水湖泊'},
		                {value:87.1, name:'季节性淡水湖'},
		                {value:25827.1, name:'草木沼泽'},
				        {value:164220, name:'库塘'},
				        {value:16402.4, name:'运河、输水河'},
		                {value:18771.7, name:'水产养殖厂'} 
		            ]
		        }
		    ]
		};
		areaProportion.setOption(areaPro);	
		$(window).resize(areaProportion.resize);
		if(window.screen.width<1601){
			$('#areaProportion canvas').css('height',$('.proportionBox').height() - 22);
		}else{
			$('#areaProportion canvas').css('height',$('.proportionBox').height() - 15);
		}
		
		$('.benefit').click(function(){
			$('.benefitBox').toggle();
			$('.benefitBox').css({'right':$('.main-right').width() + 20,});
			$('.benefitBox img').click(function(){
				$('.benefitBox').hide();
			})
		})
		
		
		if($(".main-xy-legend").height() > $(".main-xy-table").height()){
			$(".main-xy-table").css({"position":"relative", "top":"50%", "transform":"translateY(-50%)"});
		}else{
			$(".main-xy-table").css({"position":"static", "top":"auto", "transform":"translateY(0)"});
			$(".main-xy-legend").mCustomScrollbar();
		}
		var colorXy = ["#dd6b66", "#af89d6", "#7289ab", "#eedd78", "#2F4F4F", "#FF00FF", "#6495ed", "#eedd78", "#AF89D6", "#6495ED", "#808000"];
		$(".main-xy-table span").each(function(index){
			$(this).css({"background":colorXy[index]});
		})
		var valueData = [{
			name:'湿地生态效益',
			count1:51.42,
			count2:283.97,
			count3:19.52,
			count4:281.68,
			count5:10.47,
			count6:1.32,
			count7:122.97,
		},{
			name:'湿地经济效益',
			count8:384.48,
			count9:146.79,
		},{
			name:'湿地社会效益',
			count10:112.30,
			count11:26.20,
		}];
		
		var names = ["湿地生态\n效益", "湿地经济\n效益", "湿地社会\n效益"];
		var count1 = [51.42, undefined, undefined];
		var count2 = [283.97, undefined, undefined];
		var count3 = [19.52, undefined, undefined];
		var count4 = [281.68, undefined, undefined];
		var count5 = [10.47, undefined, undefined];
		var count6 = [1.32, undefined, undefined];
		var count7 = [122.97, undefined, undefined];
		var count8 = [undefined, 384.48, undefined];
		var count9 = [undefined, 146.79, undefined];
		var count10 = [undefined, undefined, 112.3];
		var count11 = [undefined, undefined, 26.2];
		var benfitOption = {
			color:['#fff'],
		    tooltip: {
		        trigger: 'axis',
		        formatter: function (datas) {
		        	var res = '';
		        	for(var i in datas){
		        		if(datas[i].data){
		        			res += datas[i].marker + datas[i].seriesName + ' : ' + datas[i].data + ' 亿元/年' + '<br/>'
		        		}
		        	}
                    return res
                }
		    },
		    grid: {
		        left: '5',
		        right: '5',
		        bottom: '3%',
		        top: '10%',
		        containLabel: true
		    },
		    legend: {
		    	show:false,
		        type:'scroll',
		        left:'0',
		        orient: 'vertical',
		        //data:['湿地生态效益','固碳释氧价值', '蓄水防洪价值', '补充地下水价值', '调节气候价值', '净化水质价值', '保持土壤价值', '物种保育价值','湿地经济效益', '湿地食物价值', '湿地供水价值', '湿地社会效益', '湿地休闲娱乐价值', '湿地环境教育价值'],
		        data:[
		        	{
		        		name:'湿地生态效益',
		        		textStyle:{
		        			fontWeight:'bold',
		        			color:'#e2aa5f',
		        			fontSize:'14'
		        		}
		        	},
		        	{
		        		name:'固碳释氧价值'
		        	},
		        	{
		        		name:'蓄水防洪价值'
		        	},
		        	{
		        		name:'补充地下水价值'
		        	},
		        	{
		        		name:'调节气候价值'
		        	},
		        	{
		        		name:'净化水质价值'
		        	},
		        	{
		        		name:'保持土壤价值'
		        	},
		        	{
		        		name:'物种保育价值'
		        	},
		        	{
		        		name:'湿地经济效益',
		        		textStyle:{
		        			fontWeight:'bold',
		        			color:'#e2aa5f',
		        			fontSize:'14'
		        		}
		        	},
		        	{
		        		name:'湿地食物价值'
		        	},
		        	{
		        		name:'湿地供水价值'
		        	},
		        	{
		        		name:'湿地社会效益',
		        		textStyle:{
		        			fontWeight:'bold',
		        			color:'#e2aa5f',
		        			fontSize:'14'
		        		}
		        	},
		        	{
		        		name:'湿地休闲娱乐价值'
		        	},
		        	{
		        		name:'湿地环境教育价值'
		        	},
		        ],
		        textStyle : {color:'#fff'},
		        pageTextStyle:{color:'#fff'},
		        pageIconColor:'#fff',
		        pageIconInactiveColor:'#fff',
		        itemWidth:10,
		        formatter: function (name) {
		        	if(name == "湿地生态效益" || name == "湿地经济效益" || name == "湿地社会效益"){
		        		return name;
		        	}else{
		        		return " "+name;
		        	}
		        	
		        }
		    },
		    xAxis: [
		        {
		            type: 'category',
		            axisTick: {alignWithLabel: true},
	            	splitLine:{show: false},
	            	axisLabel: {
	            		interval:0,
			            textStyle: {
			                color: '#169e93'
			            }
	       			 },
		            axisLine:{
		            	lineStyle:{color:'#1ad0ad',width:'2'}
		            },
		            data: names,
		            axisPointer: {
		                type: 'shadow'
		            }
		        }
		    ],
		    yAxis:{
	            type: 'value',
	            name: '',
	            axisLine:{
	            	lineStyle:{color:'#2264b5', width:'0'}
	           	},
		    	nameTextStyle:{color:'#169f94'},
		    	axisLabel: {
			            textStyle: {
			                color: '#169f94'
			            }
	       			 },
		    	splitLine:{
		    		lineStyle:{color:'#147c82'},
		    		interval:false
		    	}
	        },
		    series: [
		    	{
		            type: 'bar',
		            name: '固碳释氧价值',
		            stack: '总量',
		            barCategoryGap:'50%',
		            color: '#dd6b66',
		            data: count1
		        },
		        {
		            type: 'bar',
		            name: '蓄水防洪价值',
		            stack: '总量',
		            barCategoryGap:'50%',
		            color: '#af89d6',
		            data: count2
		        },
		        {
		            type: 'bar',
		            name: '补充地下水价值',
		            stack: '总量',
		            barCategoryGap:'50%',
		            color: '#7289ab',
		            data: count3
		        },
		        {
		            type: 'bar',
		            name: '调节气候价值',
		            stack: '总量',
		            barCategoryGap:'50%',
		            color: '#eedd78',
		            data: count4
		        },
		        {
		            type: 'bar',
		            name: '净化水质价值',
		            stack: '总量',
		            barCategoryGap:'50%',
		            color: '#2F4F4F',
		            data: count5
		        },
		        {
		            type: 'bar',
		            name: '保持土壤价值',
		            stack: '总量',
		            barCategoryGap:'50%',
		            color: '#FF00FF',
		            data: count6
		        },
		        {
		            type: 'bar',
		            name: '物种保育价值',
		            stack: '总量',
		            barCategoryGap:'50%',
		            color: '#6495ed',
		            itemStyle: {
		            	emphasis: {
                            barBorderRadius: 30
                        },
                        normal: {
                        	barBorderRadius:[5, 5, 0, 0]
                        }
		            },
		            data: count7
		        },
		        {
		            type: 'bar',
		            name: '湿地食物价值',
		            stack: '总量',
		            barCategoryGap:'50%',
		            color: '#eedd78',
		            data: count8
		        },
		        {
		            type: 'bar',
		            name: '湿地供水价值',
		            stack: '总量',
		            barCategoryGap:'50%',
		            color: '#AF89D6',
		            itemStyle: {
		            	emphasis: {
                            barBorderRadius: 30
                        },
                        normal: {
                        	barBorderRadius:[5, 5, 0, 0]
                        }
		            },
		            data: count9
		        },
		        {
		            type: 'bar',
		            name: '湿地休闲娱乐价值',
		            stack: '总量',
		            barCategoryGap:'50%',
		            color: '#6495ED',
		            data: count10
		        },
		        {
		            type: 'bar',
		            name: '湿地环境教育价值',
		            stack: '总量',
		            barCategoryGap:'50%',
		            color: '#808000',
		            itemStyle: {
		            	emphasis: {
                            barBorderRadius: 30
                        },
                        normal: {
                        	barBorderRadius:[5, 5, 0, 0]
                        }
		            },
		            data: count11
		        },
		    ]
		};
		
		benefitEchart.setOption(benfitOption);	
		$(window).resize(benefitEchart.resize);
	}
	
	$(window).resize(function(){
			//$(".main-area-legend").mCustomScrollbar("destroy");
			$(".main-xy-legend").mCustomScrollbar("destroy");
		/*if($(".main-area-legend").height() > $(".main-area-table").height()){
			$(".main-area-table").css({"position":"relative", "top":"50%", "transform":"translateY(-50%)"});
		}else{
			$(".main-area-table").css({"position":"static", "top":"auto", "transform":"translateY(0)"});
			$(".main-area-legend").mCustomScrollbar();
		}*/
		if($(".main-area-legend").height() > $(".main-area-table").height()){
			$(".main-area-table").css({"margin-top":(($(".main-area-legend").height() - $(".main-area-table").height())/2)});
		}
		
		if($(".main-xy-legend").height() > $(".main-xy-table").height()){
			$(".main-xy-table").css({"position":"relative", "top":"50%", "transform":"translateY(-50%)"});
		}else{
			$(".main-xy-table").css({"position":"static", "top":"auto", "transform":"translateY(0)"});
			$(".main-xy-legend").mCustomScrollbar();
		}
		
		var repulsion = 40;
			if($("#surveyEchart").height() > 240){
				repulsion = 60;
			}else if($("#surveyEchart").height() > 220 && $("#surveyEchart").height() < 240){
				repulsion = 50;
			}else{
				repulsion = 40;
			}
			surveyEchart.setOption({
				series: [{
					force:{
						repulsion:repulsion
					}
				}]
			});
	})
});