Echarts：【2019全国职业技能大赛大数据技术】任务四-可视化：3-酒店直销、分销订单及比率（堆叠柱状图）

超、凢脫俗 2022-12-20 02:53 18阅读 0赞

### 赛题： ###

（后期更新）

### 知识点笔记： ###

stack: '总量', //设置堆叠在一起

label: \{  
                show: true, //显示值  
                position: 'insideRight' //靠柱体的右边显示  
            \},

option = {
        title:{
            text: '酒店直销、分销订单及比率',
            textStyle:{
                color:'red',
                fontStyle:'italic',
                fontWeight:'bolder'
            },
            left:'center',
        },
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                crossStyle: {
                    color: '#999'
                }
            }
        },
        toolbox: {
            feature: {
                dataView: {show: true, readOnly: false},
                magicType: {show: true, type: ['line', 'bar']},
                restore: {show: true},
                saveAsImage: {show: true}
            }
        },
        legend: {
            data: ['酒店直销', '酒店分销','酒店分销率'],
            left:30,
        },
        xAxis: [
            {
                type: 'category',
                data: ['山水时尚酒店北京梨园店', '北京大宝饭店',  '北京普乐门白领公寓 798 精品店', '北京长得福宾馆', 
            '北京中联鑫华酒店西客站店', '北京瑞祥居宾馆',  '北京花神假日酒店'],
                axisLabel:{
                    interval:0,
                    rotate:-40
                }
            }
        ],
        yAxis: [
            {
                type: 'value',
                name: '销售数量',
                min: 0,
                max: 200,
                interval: 50,
                axisLabel: {
                    formatter: '{value}'
                }
            },
            {
                type: 'value',
                name: '分销(比例)',
                min: 0,
                max: 0.8,
                axisLabel: {
                    formatter: '{value}'
                }
            }
        ],
        series: [
            {
                name: '酒店直销',
                type: 'bar',
                stack: '总量',
                label: {
                    show: true,
                    position: 'insideRight'
                },
                data: [50, 55, 38, 80, 70, 45, 60]
            },
            {
                name: '酒店分销',
                type: 'bar',
                stack:'总量',
                label:{
                    show: true,
                    position:'insideRight'
                },
                data: [50, 55, 62, 10, 28, 50, 15]
            },
            {
                name: '酒店分销率',
                type: 'line',
                yAxisIndex: 1,
                data: [0.500000, 0.500000, 0.620000, 0.111111, 0.285714, 0.200000,0.000000]
            }
        ]
    };

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDAxNTY2OQ_size_16_color_FFFFFF_t_70][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDAxNTY2OQ_size_16_color_FFFFFF_t_70]: /images/20221120/b3c4ec21f4ee4300a25a3ba8375701ae.png