echarts5 这种效果要怎么实现，求案例

业务是比如有三家公司去一个地方，那个地方有3个车库，车库1在01/01-01/02停了公司1的10辆车，01/09-01/10停了公司2的20辆车辆，不排除01/01-01/02这个日期里车库1跟车库2都停了公司1的车辆。当没有停车的话就显示边框

https://echarts.apache.org/examples/zh/editor.html?c=heatmap-cartesian

https://echarts.apache.org/examples/zh/editor.html?c=bar-brush

option = {
    tooltip: {
        trigger: 'axis',
        axisPointer: {            // Use axis to trigger tooltip
            type: 'shadow'        // 'shadow' as default; can also be 'line' or 'shadow'
        }
    },
    legend: {
        data: ['2021-1-23', '2021-1-24', '2021-1-25', '2021-1-26', '2021-1-27']
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis: {
        type: 'value',
        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
    },
    yAxis: {
        type: 'category',
        data:['场一','场二','场三']
    },
    
    series: [
        {
            name: '2021-1-23',
            type: 'bar',
            stack: 'total',
            label: {
                show: true
            },
            emphasis: {
                focus: 'series'
            },
            data: [320, 302, 301, 334, 390, 330, 320]
        },
        {
            name: '2021-1-24',
            type: 'bar',
            stack: 'total',
            label: {
                show: true
            },
            emphasis: {
                focus: 'series'
            },
            data: [120, 132, 101, 134, 90, 230, 210]
        },
        {
            name: '2021-1-25',
            type: 'bar',
            stack: 'total',
            label: {
                show: true
            },
            emphasis: {
                focus: 'series'
            },
            data: [220, 182, 191, 234, 290, 330, 310]
        },
        {
            name: '2021-1-26',
            type: 'bar',
            stack: 'total',
            label: {
                show: true
            },
            emphasis: {
                focus: 'series'
            },
            data: [150, 212, 201, 154, 190, 330, 410]
        },
        {
            name: '2021-1-27',
            type: 'bar',
            stack: 'total',
            label: {
                show: true
            },
            emphasis: {
                focus: 'series'
            },
            data: [820, 832, 901, 934, 1290, 1330, 1320]
        }
    ]
};

想了个办法,还是没法达到x轴y轴属性不是value的情况,您看 上面的那个代码能不能符合预期。

 你说的那种效果估计很难，或许下面这种稍微改造可实现

option = {
    legend: {
        data: ['公司一', '公司二',"剩余"],
        left: '10%'
    },
    brush: {
        toolbox: ['rect', 'polygon', 'lineX', 'lineY', 'keep', 'clear'],
        xAxisIndex: 0
    },
    toolbox: {
        feature: {
            magicType: {
                type: ['stack', 'tiled']
            },
            dataView: {}
        }
    },
    tooltip: {
       
    },
    xAxis: {
        data: ["01/01-01/02","01/09-01/10"],
        name: 'X Axis',
        axisLine: {onZero: true},
        splitLine: {show: false},
        splitArea: {show: false}
    },
    yAxis: {
       
    },
    grid: {
        bottom: 100
    },
    series: [
        {
            name: '公司一',
            type: 'bar',
            stack: '车库一',
            // emphasis: emphasisStyle,
            data: [10,2],
             emphasis: {
                focus: 'series'
            },
        },
        {
            name: '公司二',
            type: 'bar',
            stack: '车库一',
          emphasis: {
                focus: 'series'
            },
            data: [2,10]
        },
        {
            name: '剩余',
            type: 'bar',
            stack: '车库一',
          emphasis: {
                focus: 'series'
            },
            data: [3,3],
            itemStyle:{
                borderType :"dashed",
                color:"transparent",
                borderColor:"red"
            }
        },
         {
            name: '公司一',
            type: 'bar',
            stack: '车库二',
        
            data: [3,2]
        },
        {
            name: '公司二',
            type: 'bar',
            stack: '车库二',
         
            data: [2,4]
        },
        {
            name: '剩余',
            type: 'bar',
            stack: '车库二',
          emphasis: {
                focus: 'series'
            },
            data: [5,4],
            itemStyle:{
                borderType :"dashed",
                color:"transparent",
                borderColor:"red"
            }
        },
    ]
};