Echarts折线图

效果预览

代码

<div id="lineChart"></div>
// 折线图
	option = {
	    tooltip : {
	        trigger: 'axis',
	        axisPointer: {
	            type: 'cross',
	            label: {
	                backgroundColor: '#6a7985'
	            }
	        }
	    },
	    grid: {
	        left: '3%',
	        right: '4%',
	        bottom: '3%',
	        containLabel: true
	    },
	    xAxis : [
	        {
	            type : 'category',
	            boundaryGap : false,
	            data : ['2008年','2009年','2010年','2011年','2012年','2013年','2014年','2015年','2016年','2017年','2018年','2019年']
	        }
	    ],
	    yAxis : [
	        {
	            type : 'value'
	        }
	    ],
	    series : [
	        {
	            name:'证书',
	            type:'line',
	            stack: '总量',
	            label: {
	                normal: {
	                    show: true,
	                    position: 'top'
	                }
	            },
	            itemStyle : {  
                    normal : {  
                        color:'#47A2FF',    //折线点和数字颜色
                        lineStyle:{  
                            color:'#47A2FF' //线条颜色
                        }  
                    }  
                },
	            areaStyle: {
	            	normal: {
	            		color:'#EBF5FF',   //区域颜色
	            	}
                },
	            data:[820, 932, 901, 934, 1290, 1330, 1320,820, 932, 901, 934, 1290]
	        }
	    ]
	};
	var myChart = echarts.init(document.getElementById('lineChart'));
	myChart.setOption(option);