tt-5-php-6001/plugin/admin/public/demos/echarts/script/column1.js

layui.use(['echarts'], function() {
	let echarts = layui.echarts;
    var column1 = echarts.init(document.getElementById('column1'),null, {
        width: 600,
        height: 400
    });
option = {
    tooltip: {
        trigger: 'axis',
        axisPointer: { 
            type: 'shadow' ,
            color: '#fff',
            fontSize: '26'
        }
    },
    legend: {
        top:'5%',
        right:'10%',
        data: ['猕猴桃', '香蕉'],
        fontSize:12,
        color:'#808080',
        icon:'rect'
    },
    grid: {
        top:60,
        left:50,
        bottom:60,
        right:60
    },
    xAxis: [{
        type: 'category',
        axisTick:{
            show:false
        },
        axisLine:{
            show:false
        },
        axisLabel:{
            color:'#4D4D4D',
            fontSize:14,
            margin:21,
            fontWeight:'bold'
        },
        data: ['第一周', '第二周', '第三周', '第四周'],
    
    }],
    yAxis: [{
        name:'单位：万',
        nameTextStyle:{
            color:'#808080',
            fontSize:12,
            padding:[0, 0, 0, -5]
        },
        max: function(value) {
            if(value.max<5){
                return 5
            }else{
                return value.max
            }
        },
        type: 'value',
        axisLine:{
            show:false
        },
        axisLabel:{
            color:'#808080',
            fontSize:12,
            margin:5
        },
        splitLine:{
            show:false
        },
        axisTick:{
            show:false
        }
    }],
    series: [
        {
            name: '猕猴桃',
            type: 'bar',
            label:{
                show:true,
                position:'top',
                fontSize:14,
                color:'#3DC3F0',
                fontWeight:'bold'
            },
            barMaxWidth:60,           
            color: {
                type: 'linear',
                x: 0,
                y: 0,
                x2: 0,
                y2: 1,
                colorStops: [{
                    offset: 0, color: '#3DC3F0' // 0% 处的颜色
                }, {
                    offset: 1, color: '#CCF2FF' // 100% 处的颜色
                }]
            },            
            data: [60, 110, 180, 100]
        }, 
        {
            name: '香蕉',
            type: 'bar',
                        label:{
                show:true,
                position:'top',
                fontSize:14,
                color:'#3D8BF0',
                fontWeight:'bold'
            },
            barMaxWidth:60,            
            color: {
                type: 'linear',
                x: 0,
                y: 0,
                x2: 0,
                y2: 1,
                colorStops: [{
                    offset: 0, color: '#3D8BF0' // 0% 处的颜色
                }, {
                    offset: 1, color: '#CCE2FF' // 100% 处的颜色
                }]
            },            
            data: [90, 130, 170, 130]
        }
    ]
};

    column1.setOption(option);

    window.onresize = function() {
        column1.resize();
    }
    
})