first commit

public/demos/echarts/script/column4.js

@@ -0,0 +1,84 @@
+layui.use(['echarts'], function() {
+	let echarts = layui.echarts;
+	var column4 = echarts.init(document.getElementById('column4'),null, {
+		width: 600,
+		height: 400
+	});
+	option = {
+		backgroundColor:'#fff',
+		title:{
+			text:"描边柱状图",
+			top:10,
+			left:15,			
+			color:"#35598d",
+			fontSize:16,
+			fontWeight:'normal'			
+		},
+		tooltip: {
+			trigger: 'axis',
+			formatter:'{b}：{c}',
+		},
+		grid: {
+			left: '5%',
+			right: '6%',
+			bottom: '3%',
+			top: '20%',
+			containLabel: true
+		},
+		xAxis :{
+			type : 'category',
+			data : ['策略1','策略2','策略3','策略4','策略5','策略6','策略7','策略8','策略9'],
+			axisLabel:{          //坐标轴字体颜色
+				color: '#9eaaba'
+			},
+			axisLine:{
+				lineStyle:{
+					color:"#e5e5e5"
+				}
+			}, 
+			axisTick:{       //y轴刻度线
+			show:false
+			},
+			splitLine:{    //网格
+				show: false,
+			}
+		},
+		yAxis :{
+			type : 'value',
+			axisLabel:{        //坐标轴字体颜色
+				color: '#9eaaba'
+			},
+			axisLine:{
+				show:false,
+			},
+			axisTick:{       //y轴刻度线
+			show:false
+			},
+			splitLine:{    //网格
+				show: true,
+				lineStyle:{
+					color:'#dadde4',
+					type:"dashed" //坐标网线类型
+				}
+			}
+		},
+		series:{
+			name:'',
+			type:'bar',
+			barWidth : '40%',  //柱子宽度
+			itemStyle:{  //柱子颜色
+				borderWidth: 2,
+				borderColor: 'rgb(79, 116, 223)',
+				color:'rgba(79, 116, 223, .3)',
+			},
+			data:[320, 332, 301, 334, 390, 330, 320, 230, 156]
+		}
+	};
+	
+	column4.setOption(option);
+
+	window.onresize = function() {
+		column4.resize();
+	}
+	
+})