data.chinahighlights.com/js/aqi.js

//Aqi Bar
function getfullname(name){
	var title = "";
	switch(name){
		case 'Excellent':
			title = 'Excellent (AQI 0-50)';
			break;
		case 'Light':
			title ='Lightly (AQI-51-100)';
			break;
		case 'Moderate':
			title = 'Moderate (AQI 101-200)';
			break;
		case 'Heavy':
			title = 'Heavy (AQI 201-300)';
			break;
		case 'Severe':
			title = 'Severe (AQI 301+)';
			break;
		default:
			break;
	}
	return title;
}

function getcolor(tmpdata) {
	var colorList = [
	  '#00B050','#FFFF00','#F79646','#FF0000','#000000'
	];
	var color = "";
	switch(tmpdata){
		case 'Excellent':
			color = '#00B050';
			break;
		case 'Light':
			color ='#FFFF00';
			break;
		case 'Moderate':
			color = '#F79646';
			break;
		case 'Heavy':
			color = '#FF0000';
			break;
		case 'Severe':
			color = '#000000';
			break;
		default:
			break;
	}
	return color;
}

function getMonthdataBar(data,month){
	var chkydata = 0;
	var obj=new Object();
	obj.Excellent = 0;
	obj.Light = 0;
	obj.Moderate = 0;
	obj.Heavy = 0;
	obj.Severe = 0;
	var myval = [];
	JSON.parse(data, function (key, value) {
		var searchstr = month + '-';
		if(key.indexOf(month) > -1){
			//console.log(value);
			//value = isNaN(parseInt(value)) ? 62 : value;
			value = parseInt(value);
			if(!isNaN(value)){
				chkydata ++;
				if(value<=50){
					obj.Excellent++;
				}else if(value>50 && value<=100){
					obj.Light++;
				}else if(value>100 && value<=200){
					obj.Moderate++;
				}else if(value>200 && value<=300){
					obj.Heavy++;
				}else{
					obj.Severe++;
				}
			}

			//myval.push(parseInt(value));
		}
	});

	var mysearise = [];
	var xdata = [];
	var ydata = [];
	for(var key in obj){
		xdata.push(key);
		//mysearise.push(getfullname(key));
		//ydata.push(parseInt(obj[key]));
		ydata.push({
						name:key,
						data:[parseInt(obj[key])],
						type:'bar',
						itemStyle: {
							normal: {
								label: {
									show:true,
									position: 'top',
									formatter: function(params){
										var c = params.value;
										if(c>0){
											return c + ' day' + (c>1 ? 's' : '');
										}else{
											return '';
										}
									},
									textStyle : {
										color:'#000'
									}
								},
								color:	function(params){
									return getcolor(params.series.name);
								}
							}
						}
					});
	}

	// 路径配置
	require.config({
		paths: {
			echarts: 'http://data.chinahighlights.com/js/echart/dist'
		}
	});

	require(
		[
			'echarts',
			'echarts/chart/bar' // 使用柱状图就加载bar模块，按需加载
		],
		function (ec) {
			if(chkydata < 1){
				return;
			}
			// 基于准备好的dom，初始化echarts图表
			var echartsId = '';
			if(typeof($('#barmain_in').html()) != 'undefined'){
				$('.aqichart').css({
					width: '700px',
					height: '300px'
				});
				echartsId = 'barmain_in';
				//var myChart = ec.init(document.getElementById('barmain_in'));
			}else{
				$('.aqichart_default').css({
					width: '700px',
					height: '300px'
				});
				echartsId = 'barmain';
			}
			var myChart = ec.init(document.getElementById(echartsId));
			option = {
				title : {
					text: $('#aqititle').text(),
					//subtext: 'whinahighlights.com',
					//sublink: '//www.chinahighlights.com',
					x:'center'
				},
				tooltip : {
					trigger: 'item',  //item|axis
					axisPointer : {            // 坐标轴指示器，坐标轴触发有效
						type : 'shadow',        // 默认为直线，可选为：'line' | 'shadow'
					},
					formatter:function(params,ticket){
						//console.log(params)
						return getfullname(params.seriesName);
					}
				},
				legend: {
					data:xdata,
					x: 'center', // 'center' | 'left' | {number},
					y: 'bottom', // 'center' | 'bottom' | {number}
					selectedMode:false,
				},
				xAxis : [
					{
						type : 'category',
						data : ['Pollution Categories']
					}
				],
				yAxis : [
					{
						type : 'value',
						name : 'Days'
					}
				],
				series : ydata
			};
			// 为echarts对象加载数据
			myChart.setOption(option);
		}
	);
}


//AQI Line

function sortNumber(a,b){
	return a - b
}

function getMonthdataLine(data,month){
	var objVal=new Object();
	var objDate=new Object();
	var mydate = [];
	var myDate = [];
	var myval = [];
	JSON.parse(data, function (key, value) {
		var searchstr = month + '-';
		if(key.indexOf(month) > -1){
			var keys = parseInt(key.replace(searchstr,""));
			//console.log(value);
			//objVal[keys] = isNaN(parseInt(value)) ? 62 : value;
			if(!isNaN(parseInt(value))){
				objVal[keys] = parseInt(value);
				objDate[keys] = keys;
				mydate.push(parseInt(keys));
			}
			//myval.push(parseInt(value));
		}
	});
	mydate.sort(sortNumber);
	//console.log(obj);
	for(var p in mydate){
		var i = mydate[p];
		myval.push(parseInt(objVal[i]));
		myDate.push(objDate[i]);
	}
	// 路径配置
	require.config({
		paths: {
			echarts: 'http://data.chinahighlights.com/js/echart/dist'
		}
	});

	require(
		[
			'echarts',
			'echarts/chart/line' // 按需加载
		],
		function (ec) {
			if(mydate.length < 1){
				return;
			}
			var echartsId = '';
			if(typeof($('#linemain_in').html()) != 'undefined'){
				$('.aqichart').css({
					width: '700px',
					height: '300px'
				});
				echartsId = 'linemain_in';
				//var myChart = ec.init(document.getElementById('barmain_in'));
			}else{
				$('.aqichart_default').css({
					width: '700px',
					height: '300px'
				});
				echartsId = 'linemain';
			}
			var myChart = ec.init(document.getElementById(echartsId));
			option = {
				/*title : {
					text: 'Air Quality in Beijing in May 2014',
					x:'center'
					subtext: 'From Chinahighlights.com',
					sublink: '//www.chinahighlights.com'
				},*/
				title: false,
				tooltip : {
					trigger: 'axis',
					axisPointer : {            // 坐标轴指示器，坐标轴触发有效
						type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
					},
					formatter:function(params){
						//console.log(params);
						//console.log(params.name);
						if(!isNaN(parseInt(params[0].name))){
							return month + '-' + ('0'+params[0].name).substr(-2) + "<br>AQI: " + params[0].data;
						}else{
							//console.log(params.data);
							if(params[0].data.type == 'average'){
								return params[0].data.name + "<br>AQI: " + params[0].data.value;
							}else{
								return '';
							}

						}
					}
				},
				xAxis : [
					{
						type : 'category',
						data : myDate,
						name : 'Date'
					}
				],
				yAxis : [
					{
						type : 'value',
						name : 'AQI'
					}
				],
				series : [
					{
						name:'AQI',
						type:'line',
						data:myval,
						itemStyle: {
							normal: {
								//color:'#cd09f0',
								color: function(params) {
									// build a color map as your need.
									//console.log(params.data);
									var colorList = [
									  '#00B050','#FFFF00','#F79646','#FF0000','#000000'
									];
									var tmp = 0;
									var tmpdata = params.data;
									if(tmpdata<=50){
										return colorList[0]
									}else if(tmpdata>50 && tmpdata<=100){
										return colorList[1]
									}else if(tmpdata>100 && tmpdata<=200){
										return colorList[2]
									}else if(tmpdata>200 && tmpdata<=300){
										return colorList[3]
									}else{
										return colorList[4]
									}
								},
								label: {
									show: false,
									position: 'top',
									formatter: '{c}',
								},
								lineStyle: {
									color:'#BE4B48'
								}
							}
						},
						markLine : {
							data : [
								{type : 'average', name : 'Average AQI for the month'}
							]
						}
					}
				]
			};
			// 为echarts对象加载数据
			myChart.setOption(option);
		}
	);
}