ss_new_ui_skin_and_page/ss/js/myEcharts.js

    var Bar,  Line, Pie;
    var charts = [];
    var chartsObje = {};
    var MyECharts = (function() {
    	//柱状图
    	var BarTemplate = {
    		color: ['#3398DB'],
    		tooltip: {
    			trigger: 'axis',
    			axisPointer: {
    				type: 'shadow'
    			}
    		},
    		grid: {
    			left: '3%',
    			right: '4%',
    			bottom: '3%',
    			top: 20,
    			containLabel: true
    		},
    		xAxis: [{
    			type: 'value'
    		}],
    		yAxis: [{
    			type: 'category',
    			data: [],
    			axisTick: {
    				alignWithLabel: true
    			}
    		}],
    		series: [{
    			name: '',
    			type: 'bar',
    			barWidth: '40%',
    			data: []
    		}]
    	};

    	var BarXxTemplate = {
    		tooltip: {
    			trigger: 'axis',
    			axisPointer: { // 坐标轴指示器，坐标轴触发有效
    				type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
    			}
    		},
    		xAxis: {
    			type: 'category',
    			data: []
    		},
    		yAxis: {
    			type: 'value'
    		},
    		series: [

    		]
    	};

    	//饼图
    	var PieTemplate = {
    		//color:['#4cabce','#e5323d'],
    		tooltip: {},
    		series: [{
    			name: 'pie',
    			type: 'pie',
    			center: ['50%', '50%'],
    			label: {
    				normal: {
    					textStyle: {
    						color: '#235894'
    					}
    				}
    			},
    			labelLine: {
    				normal: {
    					lineStyle: {
    						color: '#3E6C9F'
    					}
    				}
    			},
    			data: [],
    			itemStyle: {
    				normal: {
    					//opacity: 0.7,
    					borderWidth: 3
    						// borderColor:'#6C9FD3'
    				}
    			}
    		}]
    	};
    	/*
    	    data:[
    	        {value:335, name:'直接访问',itemStyle:{color:'white'}},
    	        {value:310, name:'邮件营销',itemStyle:{color:'#6C9FD3'}},
    	        {value:234, name:'联盟广告',itemStyle:{color:'white'}},
    	        {value:135, name:'视频广告',itemStyle:{color:'#6C9FD3'}},
    	        {value:1548, name:'搜索引擎',itemStyle:{color:'#6C9FD3'}}
    	    ],
    	*/
    	//折线图
    	var LineTemplate = {
    		tooltip: {
    			trigger: 'axis'
    		},
    		grid: {
    			left: '3%',
    			right: '4%',
    			bottom: '3%',
    			containLabel: true
    		},
    		xAxis: {
    			type: 'category',
    			boundaryGap: true, //与左边Y轴相连
    			data: [] //'周一','周二','周三','周四','周五','周六','周日'
    		},
    		yAxis: {
    			type: 'value'
    		},
    		series: [{
    			type: 'line',
    			data: [], //11,212,123,15,66....
    			itemStyle: {
    				color: "#6C9FD3"
    			}
    		}]
    	};
    	//初始化需要的参数：
    	/*
    	    id      (string)                   必填     默认为big_pie(Dom对象的id)
    	    name    (string)                   可选     鼠标悬停在统计图上是，tip显示的名字
    	    
    	    dataList(List<Map>)                必填       需要有name、value如果没有则传入第二个参数
    	    reName  (object) {name:mc,value:zrs} 可选     如果dataList中不含name、value则通过传入这个对象来替换原先dataList的Key
    	    type    (string) 'pie'||'line'||'bar'  可选   默认为pie
    	    
    
    	*/

    	var LineTemplateXx = {
    		title: {
    			text: '折线图堆叠'
    		},
    		tooltip: {
    			trigger: 'axis'
    		},
    		xAxis: {
    			type: 'category',
    			boundaryGap: false,
    			data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
    		},
    		yAxis: {
    			type: 'value'
    		},
    		series: [{
    			name: '邮件营销',
    			type: 'line', 
    			data: [120, 132, 101, 134, 90, 230, 210]
    		}, {
    			name: '联盟广告',
    			type: 'line', 
    			data: [220, 182, 191, 234, 290, 330, 310]
    		}]
    	};
    	
    	

    	var EChartManager = function(o) {
    		var seriesType = o.type || 'pie';
    		var seriesName = o.name || '';
    		var domID = o.id || 'big_pie';
    		if (!o.dataList) {
    			throw "未传入初始化的数据(dataList)";
    		}
    		var dataList = o.dataList;
    		if (o.rename) {
    			for (var i = 0; i < dataList.length; i++) {
    				if (o.rename.name) {
    					if (!dataList[i][o.rename.name]) {
    						throw o.rename.name + " notFound in " + JSON.stringify(dataList[i]);
    					}
    					dataList[i]["name"] = dataList[i][o.rename.name]
    				}
    				if (o.rename.value) {
    					var value = dataList[i][o.rename.value];
    					if (!value && value != 0) {
    						throw o.rename.value + " notFound in " + JSON.stringify(dataList[i]);
    					}
    					dataList[i]["value"] = value;
    				}
    			}
    		}
    		var clickFunction = o.clickFunction;

    		/*var myChart=chartsObje[domID];
    		if(!myChart){*/

    		//}
    		var targetDOM = document.getElementById(domID);
    		if (targetDOM) {
    			myChart = echarts.init(targetDOM);

    		} else {
    			var myChart = echarts.getInstanceByDom(o.dom)
    			if (myChart)
    				myChart.dispose();
    			myChart = echarts.init(o.dom);
    		}

    		charts.push(myChart);
    		chartsObje[domID] = myChart;
    		if (clickFunction) {
    			myChart.on("click", clickFunction);
    		}
    		seriesType = seriesType + "";
    		switch (seriesType) {
    			case 'pie': //饼状图
    				Pie = JSON.parse(JSON.stringify(PieTemplate));
    				this.handlePieData(dataList, seriesName, o);
    				myChart.setOption(Pie, true, null, o.callback);
    				break;
    			case '1': //饼状图
    				Pie = JSON.parse(JSON.stringify(PieTemplate));
    				this.handlePieData(dataList, seriesName, o);
    				myChart.setOption(Pie, true, null, o.callback);
    				break;

    			case 'line': //折状图
    				Line = JSON.parse(JSON.stringify(LineTemplate));
    				this.handleLineData(dataList, seriesName, o);
    				myChart.setOption(Line, true, null, o.callback);
    				break;
    			case '11': //折状图
    				Line = JSON.parse(JSON.stringify(LineTemplate));;
    				this.handleLineData(dataList, seriesName, o);
    				myChart.setOption(Line, true, null, o.callback);
    				break;

    			default:
    				Bar = JSON.parse(JSON.stringify(BarTemplate));
    				this.handleBarData(dataList, seriesName, o);

    				myChart.setOption(Bar, true, null, o.callback);
    		}
    	};
    	EChartManager.prototype = {
    		handleColor: function(obj, o) {
    			if (o.color) {

    			}
    		},
    		handlePieData: function(list, seriesName, o) {
    			this.addOption(Pie, o.optionObj);
    			var data = [];
    			for (var i = 0; i < list.length; i++) {
    				if (!("name" in list[i]) || !("value" in list[i])) {
    					throw "传入的初始化对象数组dataList应含有name和value";
    				}
    				var temp = {};
    				if (o.color) {
    					for (var prop in list[i]) {
    						temp[prop] = list[i][prop];
    					}
    					if (o.color[temp["name"]]) {
    						temp["itemStyle"] = {
    							color: o.color[temp["name"]]
    						}
    					}
    				} else {
    					for (var prop in list[i]) {
    						temp[prop] = list[i][prop];
    					}
    				}
    				data.push(temp);
    			}
    			if (o.name) {
    				Pie["title"] = {};
    				Pie["title"]["left"] = 30;
    				Pie["title"]["text"] = o.name;
    			}

    			Pie.series[0].data = data;
    			Pie.series[0].name = seriesName;
    		},
    		handleLineData: function(list, seriesName, o) {
    			var sanjzbOne = list[0].sanjzblist;

    			if (sanjzbOne && sanjzbOne.length > 0) {
    				Line = JSON.parse(JSON.stringify(LineTemplateXx));
    				this.addOption(Line, o.optionObj);
    				Line.title.text=o.name;
    				Line.xAxis.data=[];
    				Line.series=[];
    				var names=[];
    				for (var i = 0; i < list.length; i++) {
    					var item = list[i];
    					Line.xAxis.data.push(item.name);
    					var sanjzbList = item.sanjzblist;

    					for (var j = 0; j < sanjzbList.length; j++) {
    						var sanItem = sanjzbList[j];
    						if (names.indexOf(sanItem.mc)==-1) {
    							var series = {
    								name: sanItem.mc,
    								type: 'line',
    								data: []
    							};
    							Line.series.push(series);
    							names.push(sanItem.mc);
    						}
    					}
    				}
    				
    				for (var i = 0; i < list.length; i++) {
    					var item = list[i];
    					var sanjzbList = item.sanjzblist;
    					for (var seriesIndex in Line.series) {
    						var seriesItem=Line.series[seriesIndex];
    						var name=seriesItem.name;
    						var setSl = false;
    						for (var j = 0; j < sanjzbList.length; j++) {
    							var sanItem = sanjzbList[j];
    							if (name == sanItem.mc) {
    								setSl = true;
    								seriesItem.data.push(sanItem.sl);
    								break;
    							}
    						}
    						if (setSl == false) {
    							seriesItem.data.push(0);
    						}
    					}
    				}
    				
    				
    				

    			} else {
    				this.addOption(Line, o.optionObj);
    				var seriesData = [];
    				var xAxisData = [];
    				for (var i = 0; i < list.length; i++) {
    					if (!("name" in list[i]) || !("value" in list[i])) {
    						throw "传入的初始化对象数组dataList应含有name和value";
    					}
    					var temp = {};
    					for (var prop in list[i]) {
    						temp[prop] = list[i][prop];
    						if (prop == 'name') {
    							xAxisData.push(list[i][prop]);
    						}
    					}
    					seriesData.push(temp);
    				}
    				if (o.name) {
    					Line["title"] = {};
    					Line["title"]["left"] = 30;
    					Line["title"]["text"] = o.name;
    				}

    				Line.xAxis.data = xAxisData;
    				Line.series[0].data = seriesData;
    				Line.series[0].name = seriesName;
    			}

    		},
    		handleBarData: function(list, seriesName, o) {
    			var sanjzbOne = list[0].sanjzblist;

    			if (sanjzbOne && sanjzbOne.length > 0) {

    				Bar = JSON.parse(JSON.stringify(BarXxTemplate));
    				this.addOption(Bar, o.optionObj);

    				var xAxisData = [];
    				var obj = {};
    				Bar.xAxis.data = [];
    				Bar.series = [];
    				for (var i = 0; i < list.length; i++) {
    					var item = list[i];
    					xAxisData.push(item.name);
    					var sanjzbList = item.sanjzblist;

    					for (var j = 0; j < sanjzbList.length; j++) {
    						var sanItem = sanjzbList[j];
    						if (!obj[sanItem.mc]) {
    							var series = {
    								name: sanItem.mc,
    								type: 'bar',
    								stack: '总量',
    								data: []
    							};
    							obj[sanItem.mc] = series;
    						}
    					}
    				}

    				for (var i = 0; i < list.length; i++) {
    					var item = list[i];
    					var sanjzbList = item.sanjzblist;
    					for (var mc in obj) {
    						var setSl = false;
    						for (var j = 0; j < sanjzbList.length; j++) {
    							var sanItem = sanjzbList[j];
    							if (mc == sanItem.mc) {
    								setSl = true;
    								obj[sanItem.mc].data.push(sanItem.sl);
    								break;
    							}
    						}
    						if (setSl == false) {
    							obj[mc].data.push(0);
    						}
    					}
    				}

    				Bar.xAxis.data = xAxisData;
    				for (var key in obj) {
    					Bar.series.push(obj[key]);
    				}
    			} else {
    				Bar = JSON.parse(JSON.stringify(BarTemplate));
    				this.addOption(Bar, o.optionObj);
    				var seriesData = [];
    				var yAxisData = [];
    				for (var i = 0; i < list.length; i++) {
    					if (!("name" in list[i]) || !("value" in list[i])) {
    						throw "传入的初始化对象数组dataList应含有name和value";
    					}
    					var temp = {};
    					for (var prop in list[i]) {
    						temp[prop] = list[i][prop];
    						if (prop == 'name') {
    							yAxisData.push(list[i][prop]);
    						}
    					}
    					seriesData.push(temp);
    				}
    				Bar.yAxis[0].data = [];
    				Bar.series[0].data = [];
    				Bar.series[0].name = [];
    				Bar.yAxis[0].data = yAxisData;
    				Bar.series[0].data = seriesData;
    				Bar.series[0].name = seriesName;
    			}

    			if (o.name) {
    				Bar["title"] = {};
    				Bar["title"]["left"] = 30;
    				Bar["title"]["text"] = o.name;
    			}

    		},
    		addOption: function(oldOption, newOption) {
    			if (!newOption) {
    				return;
    			}
    			oldOption = Object.assign(oldOption, newOption);
    		}

    	};
    	return {
    		init: function(o) {
    			var obj = new EChartManager(o);
    		}
    	};
    })();