echarts基本配置项总结，注释很全

$(function(){
	PingHeng();
});
function PingHeng(){
	var options={
       	idDiv:'pingheng_echart'//容器-- 必填
   	};	
	//	基于准备好的dom，初始化echarts实例
	var myChart = echarts.init(document.getElementById(options.idDiv));
	//	引用
	option = {
		title:{
			text:'这是title部分',
			show:true,   //标题是否显示
			link: 'https://www.echartsjs.com/option.html#title.link' ,  //链接到的地址
			target: 'blank', //当前窗口打开链接还是新窗口打开链接 blank/self
			textStyle:{
				color:'#ccc',         
				fontStyle:'oblique',  //字体italic,oblique,normal
				fontFamily:'Microsoft YaHei', //主标题文字的字体系列，感觉没啥用
				fontSize:20,
				align:'center',  //文字水平对齐方式，默认自动left/center/right
				verticalAlign:'middle',  //top/middle/bottom
				lineHeight:80,  //行高
				textBorderColor:'red' //文字本身的描边颜色。
				,textBorderWidth:4   //文字本身的描边宽度。
				,textShadowColor:'#000'  //文字本身的阴影颜色。
				,textShadowBlur:5   //文字本身的阴影长度。
				,textShadowOffsetX:5  //文字本身的阴影 X 偏移。
				,textShadowOffsetY:5  //文字本身的阴影 Y 偏移。
			}
			,subtext:'这是副标题'
			,sublink:'https://www.echartsjs.com/option.html#title.link'   //链接到的地址
			,subtarget:'blank'   //指定窗口打开副标题超链接.self/blank
			,subtextStyle:{
				fontSize:20
			}
			,itemGap:20   //主副标题之间的间距
			,zlevel:20
			,z:30   //组件的所有图形的z值。控制图形的前后顺序。z值小的图形会被z值大的图形覆盖。
			,padding:20     //标题内边距，单位px，默认各方向内边距为5，接受数组分别设定上右下左边距。 
			,left:10 //left 的值可以是像 20 这样的具体像素值，可以是像 '20%' 这样相对于容器高宽的百分比，也可以是 'left', 'center', 'right'。如果 left 的值为'left', 'center', 'right'，组件会根据相应的位置自动对齐。
			,right:100
			,bottom:100
			,top:50
			,backgroundColor:'red'   //标题背景色，默认透明。
			,borderColor:'red'  //标题的边框颜色
			,borderWidth:2   //标题的边框线宽。
			,borderRadius:4   //圆角半径，单位px，支持传入数组分别指定 4 个圆角半径。
			,shadowBlur:10 //图形阴影的模糊大小
			,shadowColor:'#000'  //阴影颜色
			,shadowOffsetX:10 //阴影水平方向上的偏移距离
			,shadowOffsetY:10 //阴影垂直方向上的偏移距离
		},
		legend: {
			type:'scroll',
			right:0,      //位置
	        ,data:['蒸发量','降水量','平均温度']
	    },
	    tooltip: {
	    	show:true,  //是否显示提示框组件，包括提示框浮层
	        trigger: 'axis',
	        axisPointer: {
	            type: 'cross',
	            crossStyle: {
	                color: '#999'
	            }
	        }
	    },
	    toolbox: {
	        feature: {
	            dataView: {show: true, readOnly: false},
	            magicType: {show: true, type: ['line', 'bar']},
	            restore: {show: true},
	            saveAsImage: {show: true}
	        }
	    },
	    xAxis: [
	        {
	        	show:true           //x轴是否显示
	            ,type: 'category'   //坐标轴类型。value/category/time/log
	            ,gridIndex:0           //?
	            ,position:'bottom'
	            ,offset:10       //x轴距离X轴线的距离
	            //类目数据，在类目轴（type: 'category'）中有效。
	            ,data: ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月']
	            ,name:'X轴名称'
	            ,nameLocation:'start'    //坐标轴名称显示位置。start/center/end
	            ,nameTextStyle:{   //坐标轴名称的文字样式
	            	/*color: ...,
								fontStyle: 'normal',
								fontWeight: normal,
								fontFamily: 'sans-serif',
								fontSize: 12,
								align: ...,
								verticalAlign: ...,
								lineHeight: ...,
								backgroundColor: 'transparent',
								borderColor: 'transparent',
								borderWidth: 0,
								borderRadius: 0,
								padding: 0,
								shadowColor: 'transparent',
								shadowBlur: 0,
								shadowOffsetX: 0,
								shadowOffsetY: 0,
								width: ...,
								height: ...,
								textBorderColor: 'transparent',
								textBorderWidth: 0,
								textShadowColor: 'transparent',
								textShadowBlur: 0,
								textShadowOffsetX: 0,
								textShadowOffsetY: 0*/
	            }
	            ,nameGap:20  //坐标轴名称与轴线之间的距离。
	            ,nameRotate:30   //坐标轴名字旋转，角度值。
	            ,inverse:false   //是否是反向坐标轴。ECharts 3 中新加。
	            ,boundaryGap:true  //坐标轴两边留白策略，类目轴和非类目轴的设置和表现不一样。
	            /*,min:   //坐标轴刻度最小值。
	            ,max:  //坐标轴刻度最大值。
	            ,scale： //只在数值轴中（type: 'value'）有效。是否是脱离 0 值比例。设置成 true 后坐标刻度不会强制包含零刻度。在双数值轴的散点图中比较有用。
	            ,splitNumber://分割段数，在类目轴中无效
	            ,minInterval: //自动计算的坐标轴最小间隔大小，只在数值轴或时间轴中（type: 'value' 或 'time'）有效。
	            ,maxInterval: //自动计算的坐标轴最大间隔大小，只在数值轴或时间轴中（type: 'value' 或 'time'）有效。
	            ,interval:  //强制设置坐标轴分割间隔。不建议使用。
	            ,logBase:  //对数轴的底数，只在对数轴中（type: 'log'）有效。
	            ,silent:  //坐标轴是否是静态无法交互
	            ,triggerEvent:false //坐标轴的标签是否响应和触发鼠标事件，默认不响应。*/
	           
	            //坐标轴轴线相关设置(横线)
	            ,axisLine:{
	            	show:true  //是否显示坐标轴轴线。
	            	/*,onZero:false  //X 轴或者 Y 轴的轴线是否在另一个轴的 0 刻度上，只有在另一个轴为数值轴且包含 0 刻度时有效。
	            	,onZeroAxisIndex: //当有双轴时，可以用这个属性手动指定，在哪个轴的 0 刻度上。*/
	            	,symbol:["none","arrow"]    //一端有箭头，另一端没有
	            	,symbolSize:[20,30]  //轴线两边的箭头的大小，第一个数字表示宽度（垂直坐标轴方向），第二个数字表示高度（平行坐标轴方向）
	            	//轴线的样式
	            	,lineStyle:{
	            		/*color: '#333',
						width: 1,
						type: 'solid',
						shadowBlur: ...,
						shadowColor: ...,
						shadowOffsetX: 0,
						shadowOffsetY: 0,*/
	            	}
	            }
	            //坐标轴刻度相关设置
	            ,axisTick:{
	            	show:true    //是否显示坐标轴刻度。
	            	,alignWithLabel:true   //类目轴中在 boundaryGap 为 true 的时候有效，可以保证刻度线和标签对齐
	            	,inside:false   //坐标轴刻度是否朝内，默认朝外。
	            	,length:20   //刻度线长度
	            	,lineStyle:{
	            		//同axisLine的lineStyle
	            	}
	            }
	            //坐标轴刻度标签的相关设置。
	            ,axisLabel:{
	            	show:true
                    ,interval:1   //可以设置成 0强制显示所有标签。如果设置为 1，表示『隔一个标签显示一个标签』，如果值为 2，表示隔两个标签显示一个标签，以此类推。
                	,inside:false  //刻度标签是否朝内，默认朝外
                	,rotate:30  //刻度标签旋转的角度，在类目轴的类目标签显示不下的时候可以通过旋转防止标签之间重叠。
                	,margin:30  //刻度标签与轴线之间的距离。
                	,showMinLabel:true  //是否显示最小 tick 的 label。可取值 true, false, null。默认自动判定（即如果标签重叠，不会显示最小 tick 的 label）。
                	,showMaxLabel:true  //是否显示最大 tick 的 label。可取值 true, false, null。默认自动判定（即如果标签重叠，不会显示最大 tick 的 label）。
                	/*color: ...,
										fontStyle: 'normal',
										fontWeight: normal,
										fontFamily: 'sans-serif',
										fontSize: 12,
										align: ...,
										verticalAlign: ...,
										lineHeight: ...,
										backgroundColor: 'transparent',
										borderColor: 'transparent',
										borderWidth: 0,
										borderRadius: 0,
										padding: 0,
										shadowColor: 'transparent',
										shadowBlur: 0,
										shadowOffsetX: 0,
										shadowOffsetY: 0,
										width: ...,
										height: ...,
										textBorderColor: 'transparent',
										textBorderWidth: 0,
										textShadowColor: 'transparent',
										textShadowBlur: 0,
										textShadowOffsetX: 0,
										textShadowOffsetY: 0,*/
	            }
	            ,axisPointer: {
	                type: 'line'
	            }
	        }
	    ],
	    yAxis: [
	        {
	            type: 'value',
	            name: '水量',
	            min: 0,
	            show:false,
	            max: 250,
	            interval: 50,
	            axisLabel: {
	                formatter: '{value} ml'
	            }
	        }
	    ],
	    series: [
	        {  //柱状图
	            name:'蒸发量',
	            type:'bar',
	            data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
	        }
	        ,
	        {
                name:'折线',
                type:'line',
                smooth: true, //由生硬的直线变成缓的
                data:[50, 75, 100, 150, 200, 250, 150, 100, 95, 160, 50, 45],
                itemStyle : {  /*设置折线颜色*/
                    normal : {
                        color: {  //渐变
						    x: 0,
						    y: 0,
						    x2: 1,
						    y2: 0,
						    colorStops: [{
						        offset: 0, color: '#4C84FF' // 0% 处的颜色
						    }, {
						        offset: 1, color: '#F07AAD' // 100% 处的颜色
						    }],
						    globalCoord: false // 缺省为 false
						}
                    }
                }
            },
	        {
                name:'折线',
                type:'line',
                smooth: true, //由生硬的直线变成缓的
                data:[20, 34, 145, 11, 34, 56, 233, 145, 43, 34, 98, 45]
            }
	    ]
	};

	//为echarts对象加载数据
	myChart.setOption(option);
}


/*
 注：pie饼状图的series里面的roseType属性，可选择两种模式：'radius' 扇区圆心角展现数据的百分比，半径展现数据的大小。
 'area' 所有扇区圆心角相同，仅通过半径展现数据大小。
 * */