[Bug] effect of barMinHeight is incorrect in the datazoom when set filterMode: 'axis'

[xiaoluoHe]

Version

1.12.6

Link to Minimal Reproduction

none

Steps to Reproduce

const spec = {
  type: 'common',
  padding: 10,
  layout: {
    type: 'grid',
    col: 2,
    row: 5,
    rowHeight: [
      {
        index: 3,
        size: 100
      }
    ],
    elements: [
      {
        modelId: 'legend',
        col: 0,
        colSpan: 2,
        row: 0
      },
      {
        modelId: 'axis-left',
        col: 0,
        row: 1
      },
      {
        modelId: 'axis-left-2',
        col: 0,
        row: 3
      },
      {
        modelId: 'metric-region',
        col: 1,
        row: 1
      },
      {
        modelId: 'axis-middle',
        col: 1,
        row: 2
      },
      {
        modelId: 'event-region',
        col: 1,
        row: 3
      },
      {
        modelId: 'datazoom',
        col: 0,
        colSpan: 2,
        row: 4
      },
    ]
  },
  region: [
    {
      id: 'metric-region'
    },
    {
      id: 'event-region',
    },
  ],
  legends: {
    visible: true,
    orient: 'top',
    id: 'legend',
    regionId: ['event-region', 'metric-region']
  },
  series: [
    {
      id: 'metric',
      regionId: 'metric-region',
      type: 'area',
      point: { visible: false },
      xField: 'timestamp',
      yField: 'value',
      line: {
        style: {
          curveType: 'monotone'
        }
      },
      data: {
        id: 'line',
        values: [
          {
            "timestamp": 0,
            "value": 854
          },
          {
            "timestamp": 1,
            "value": 927
          },
          {
            "timestamp": 2,
            "value": 407
          },
          {
            "timestamp": 3,
            "value": 714
          },
          {
            "timestamp": 4,
            "value": 583
          },
          {
            "timestamp": 5,
            "value": 987
          },
          {
            "timestamp": 6,
            "value": 765
          },
          {
            "timestamp": 7,
            "value": 741
          },
          {
            "timestamp": 8,
            "value": 469
          },
          {
            "timestamp": 9,
            "value": 628
          }
        ]
      },
    },
    {
      id: 'x',
      regionId: 'event-region',
      type: 'rangeColumn',
      xField: ['startTimestamp', 'endTimestamp'],
      yField: 'type',
      direction: 'horizontal',
      data: {
        id: 'eventData',
        values: [
          {
            "type": 2,
            "startTimestamp": 0,
            "endTimestamp": 0
          },
          {
            "type": 1,
            "startTimestamp": 1,
            "endTimestamp": 2
          },
          {
            "type": 0,
            "startTimestamp": 3,
            "endTimestamp": 5
          },
          {
            "type": 2,
            "startTimestamp": 4,
            "endTimestamp": 4
          }
        ]
      },
      barMinHeight:10,
      barBackground: {
        visible: true,
        style: {
          cornerRadius: [5, 5, 5, 5],
          height: 10
        }
      },
      bar: {
        style: {
          cornerRadius: [5, 5, 5, 5],
          height: 10,
        }
      },
      seriesField: 'type',
      tooltip: { visible: false }
    },
  ],
  dataZoom: [
    {
      offsetX: 180,
      orient: 'bottom',
      id: "datazoom",
      filterMode:"axis",
      axisId: ['axis-middle'],
      width: ({ width }) => width - 200
    }
  ],
  axes: [
    {
      id: 'axis-left',
      regionId: 'metric-region',
      orient: 'left',
      label: {
        flush: true
      }
    },
    {
      id: 'axis-left-2',
      regionId: 'event-region',
      orient: 'left',
      type: "band",
      visible: false
    },
    {
      id: 'axis-middle',
      regionId: ['metric-region', 'event-region'],
      type: 'linear',
      orient: 'bottom',
      grid: { visible: false }
    },
  ],
  tooltip: {
    dimension: {
      visible: true
    }
  },
  customMark: [
    {
      type: "rect",
      style: {
        width: 180,
        height: 24,
        fill:false,
        x: 10,
        y: 490,
        html: () => {
          const color = '#1664FF';
          return {
            dom: `
              <button style="
              margin:0;
              width: 180px;
              font-weight:500;
              line-height: 18px;
              font-size:12px;
              color:#646475;
              ">111</button>
            `
          };
        }
      }
    }
  ]
};


const vchart = new VChart(spec, { dom: CONTAINER_ID,enableHtmlAttribute:  true });
vchart.renderSync();
window['vchart'] = vchart;

Current Behavior

bar mark cannot be filtered by datazoom

Expected Behavior

bar mark should be filtered

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

No response