option = { backgroundColor: '#080b30', title: { text: '教师活跃度分析', textStyle: { align: 'center', color: '#fff', fontSize: 20, }, left: 'center', }, legend: { data: ['高一', '高二','高三'], top: '5%', textStyle:{ color:'white', //坐标的字体颜色 }, }, tooltip: { trigger: 'axis', axisPointer: { lineStyle: { color: { type: 'linear', x: 0, y: 0, x2: 0, y2: 1, colorStops: [{ offset: 0, color: 'rgba(0, 255, 233,0)' }, { offset: 0.5, color: 'rgba(255, 255, 255,1)', }, { offset: 1, color: 'rgba(0, 255, 233,0)' }], global: false } }, }, }, grid: { top: '15%', left: '5%', right: '5%', bottom: '15%', // containLabel: true }, xAxis: [{ type: 'category', axisLine: { show: true }, splitArea: { // show: true, color: '#f00', lineStyle: { color: '#f00' }, }, axisLabel: { color: '#fff' }, splitLine: { show: false }, boundaryGap: false, data: ['非常活跃', '活跃', '一般', '差'], }], yAxis: [{ type: 'value', min: 0, // max: 140, splitNumber: 4, splitLine: { show: true, lineStyle: { color: 'rgba(255,255,255,0.1)' } }, axisLine: { show: false, }, axisLabel: { show: false, margin: 20, textStyle: { color: '#d1e6eb', }, }, axisTick: { show: false, }, }], series: [{ name: '高三', type: 'line', // smooth: true, //是否平滑 showAllSymbol: true, // symbol: 'image://./static/images/guang-circle.png', symbol: 'circle', symbolSize: 25, lineStyle: { normal: { color: "#6c50f3", shadowColor: 'rgba(0, 0, 0, .3)', shadowBlur: 0, shadowOffsetY: 5, shadowOffsetX: 5, }, }, label: { show: true, position: 'top', textStyle: { color: '#6c50f3', } }, itemStyle: { color: "#6c50f3", borderColor: "#fff", borderWidth: 3, shadowColor: 'rgba(0, 0, 0, .3)', shadowBlur: 0, shadowOffsetY: 2, shadowOffsetX: 2, }, tooltip: { show: false }, areaStyle: { normal: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ offset: 0, color: 'rgba(108,80,243,0.3)' }, { offset: 1, color: 'rgba(108,80,243,0)' } ], false), shadowColor: 'rgba(108,80,243, 0.9)', shadowBlur: 20 } }, data: [50, 20, 32, 98] }, { name: '高一', type: 'line', // smooth: true, //是否平滑 showAllSymbol: true, // symbol: 'image://./static/images/guang-circle.png', symbol: 'circle', symbolSize: 25, lineStyle: { normal: { color: "#00ca95", shadowColor: 'rgba(0, 0, 0, .3)', shadowBlur: 0, shadowOffsetY: 5, shadowOffsetX: 5, }, }, label: { show: true, position: 'top', textStyle: { color: '#00ca95', } }, itemStyle: { color: "#00ca95", borderColor: "#fff", borderWidth: 3, shadowColor: 'rgba(0, 0, 0, .3)', shadowBlur: 0, shadowOffsetY: 2, shadowOffsetX: 2, }, tooltip: { show: false }, areaStyle: { normal: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ offset: 0, color: 'rgba(0,202,149,0.3)' }, { offset: 1, color: 'rgba(0,202,149,0)' } ], false), shadowColor: 'rgba(0,202,149, 0.9)', shadowBlur: 20 } }, data: [71, 98, 14, 79], }, { name: '高二', type: 'line', // smooth: true, //是否平滑 showAllSymbol: true, // symbol: 'image://./static/images/guang-circle.png', symbol: 'circle', symbolSize: 25, lineStyle: { normal: { color: "orange", shadowColor: 'rgba(0, 0, 0, .3)', shadowBlur: 0, shadowOffsetY: 5, shadowOffsetX: 5, }, }, label: { show: true, position: 'top', textStyle: { color: 'orange', } }, itemStyle: { color: "orange", borderColor: "white", borderWidth: 3, shadowColor: '', shadowBlur: 0, shadowOffsetY: 2, shadowOffsetX: 2, }, tooltip: { show: false }, areaStyle: { normal: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ offset: 0, color: 'rgba(0,202,149,0.3)' }, { offset: 1, color: 'rgba(0,202,149,0)' } ], false), shadowColor: 'rgba(0,202,149, 0.9)', shadowBlur: 20 } }, data: [81, 68, 64, 19], }, ] };