GSYH/static/js/myjs/maintenancePlan.js

$(function(){
	initPlanInput();
});

function initPlanInput1(){
	var dom = document.getElementById("planInput1");
	var myChart = echarts.init(document.getElementById('planInput1'));
	var colorList = {
		    type: 'linear',
		    x: 0,
		    y: 0,
		    x2: 0,
		    y2: 1,
		    colorStops: [{
		        offset: 0,
		        color: '#06DBF5' // 0% 处的颜色
		    }, {
		        offset: 1,
		        color: '#00d386' // 100% 处的颜色
		    }],
		    globalCoord: false // 缺省为 false
		}
	option = {
			 backgroundColor: '#fff',
			    tooltip: {
			        trigger: 'axis',
			        axisPointer: { // 坐标轴指示器，坐标轴触发有效
			            type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
			        }
			    },
			    grid: {
			        left: '3%',
			        right: '4%',
			        bottom: '0%',
			        containLabel: true
			    },
			    xAxis: {
			        type: 'category',
			        data: ['2012', '2013', '2014', '2015', '2016',
			            '2017', '2018'
			        ],
			        // axisTick: {
			        //     alignWithLabel: true
			        // }
			        axisLine: {
			            lineStyle: {
			                color: 'black'

			            }
			        },
			        axisLabel: {
			            interval: 0,
			            rotate: 40,
			            textStyle: {
			                fontFamily: 'Microsoft YaHei'
			            }
			        },
			    },

			    yAxis: {
			        type: 'value',
			        axisLine: {
			            // show: false,
			            lineStyle: {
			                color: 'black'
			            }

			        },
			        splitLine: {
			            show: true,
			            lineStyle: {
			                color: 'rgba(255,255,255,0.3)'
			            }
			        },
			        axisLabel: {

			        }
			    },

			    series: [{
			        name: '',
			        type: 'bar',
			        barWidth: '40%',
			        itemStyle: {
			            color: function(params) {
			                return colorList;
			            },
			            //barBorderRadius: 15,
			        },
			        emphasis:{
			            itemStyle:{
			                color:'#FBB419'
			                
			            }
			            
			        },
			        data: [100, 120, 150, 140, 170, 160, 180]
			    }]
			};
	if (option && typeof option === "object") {
	    myChart.setOption(option, true);
	}
}

function initPlanInput(){
	var dom = document.getElementById("planInput");
	var myChart = echarts.init(document.getElementById('planInput'));
	var data = [2220, 1682, 2791, 3000, 4090, 3230, 2910];
	var xdata = ['2012', '2013', '2014', '2015', '2016', '2017', '2018'];
	var option = {
	    grid: {
	        left: 30,
	        right: 50,
	        top: 50,
	        bottom: 30,
	        containLabel: true
	    },
	    xAxis: {
	        type: 'category',
	        // boundaryGap: false,
	        data: xdata,
	        triggerEvent: true,
	        splitLine: {
	            show: false
	        },
	        axisLine: {
	            show: true,
	            lineStyle: {
	                width: 2,
	                color: 'rgba(255,255,255,.6)'
	            }
	        },
	        axisTick: {
	            show: false
	        },
	        axisLabel: {
	            color: '#000',
	            fontSize: 16,
	            fontWeight: 'bold',
	            /*textShadowColor: '#000',
	            textShadowOffsetY: 2*/
	        }
	    },
	    yAxis: {
	        name: '单位（万元）',
	        nameTextStyle: {
	            color: '#000',
	            fontSize: 16,
	            /*textShadowColor: '#000',
	            textShadowOffsetY: 2*/
	        },
	        type: 'value',
	        splitLine: {
	            show: true,
	            lineStyle: {
	                color: 'rgba(255,255,255,.2)'
	            }
	        },
	        axisLine: {
	            show: true,
	            lineStyle: {
	                width: 2,
	                color: 'rgba(255,255,255,.6)'
	            }
	        },
	        axisTick: {
	            show: true
	        },
	        axisLabel: {
	            color: '#000',
	            fontSize: 16,
	            /*textShadowColor: '#000',
	            textShadowOffsetY: 2*/
	        }
	    },
	    series: [{
	        data: data,
	        type: 'line',
	        symbol: 'circle',
	        symbolSize: 12,
	        color: '#FEC201',
	        lineStyle: {
	            color: "#03E0F2"
	        },
	        label: {
	            show: true,
	            position: 'top',
	            textStyle: {
	                color: '#FEC201',
	                fontSize: 18,
	                fontWeight: 'bold'
	            }
	        },
	        areaStyle: {
	            color: 'rgba(1,98,133,0.6)'
	        }
	    }, {
	        type: 'bar',
	        animation: false,
	        barWidth: 3,
	        hoverAnimation: false,
	        data: data,
	        tooltip: {
	            show: false
	        },
	        itemStyle: {
	            normal: {
	                color: {
	                    type: 'linear',
	                    x: 0,
	                    y: 0,
	                    x2: 0,
	                    y2: 1,
	                    colorStops: [{
	                        offset: 0,
	                        color: '#91EAF2' // 0% 处的颜色
	                    }, {
	                        offset: 1,
	                        color: '#074863' // 100% 处的颜色
	                    }],
	                    globalCoord: false // 缺省为 false
	                },
	                label: {
	                    show: false
	                }
	            }
	        }
	    }]
	}
	if (option && typeof option === "object") {
	    myChart.setOption(option, true);
	}
}