[Bug] configuration area.interactive: false is not work

[xiaoluoHe]

Version

1.6.2

Link to Minimal Reproduction

none

Steps to Reproduce

const spec = {
  type: 'area',
  data: {
    values: [
      {
        time: '2:00',
        value: 8
      },
      {
        time: '4:00',
        value: 9
      },
      {
        time: '6:00',
        value: 11
      },
      {
        time: '8:00',
        value: 14
      },
      {
        time: '10:00',
        value: 16
      },
      {
        time: '12:00',
        value: 17
      },
      {
        time: '14:00',
        value: 17
      },
      {
        time: '16:00',
        value: 16
      },
      {
        time: '18:00',
        value: 15
      }
    ]
  },
  area:{
    // visible:false,
    interactive:false
  },
  point:{
    // interactive:false
  },
  xField: 'time',
  yField: 'value'
};

const vchart = new VChart(spec, { dom: CONTAINER_ID });
vchart.renderAsync();
vchart.on('click',(e)=>{
  console.log(e.datum?.dataSeries,e.mark?.type)
});
// Just for the convenience of console debugging, DO NOT COPY!
window['vchart'] = vchart;

Current Behavior

Expected Behavior

设置了 area.interactive: false 后，面积不再响应交互

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

No response

[xile611]

VisActor/VRender#792

[xiaoluoHe]

补充 case

const spec ={
  "type": "common",
  "theme": {
    "background": "rgba(0,0,0,0)"
  },
  "color": [
    "#4e83fd",
    "#50cefb"
  ],
  "padding": 0,
  "height": 312,
  "width": 698,
  "data": [
    {
      "id": "comboBarData",
      "values": [
        {
          "dataSeries": "bar",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991": "张三",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991-originData": "张三",
          "86252231-6298-4c4f-8c50-968849d86a6e": 136
        },
        {
          "dataSeries": "bar",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991": "王武",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991-originData": "王武",
          "86252231-6298-4c4f-8c50-968849d86a6e": 11
        },
        {
          "dataSeries": "bar",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991": "赵六",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991-originData": "赵六",
          "86252231-6298-4c4f-8c50-968849d86a6e": -50
        },
        {
          "dataSeries": "bar",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991": "里斯",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991-originData": "里斯",
          "86252231-6298-4c4f-8c50-968849d86a6e": 99
        }
      ]
    },
    {
      "id": "comboLineData",
      "values": [
        {
          "dataSeries": "line",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991": "张三",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991-originData": "张三",
          "e3ed695a-98a2-4c4d-99f7-cd0c5dea5e9e": 190
        },
        {
          "dataSeries": "line",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991": "王武",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991-originData": "王武",
          "e3ed695a-98a2-4c4d-99f7-cd0c5dea5e9e": 55.5555
        },
        {
          "dataSeries": "line",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991": "赵六",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991-originData": "赵六",
          "e3ed695a-98a2-4c4d-99f7-cd0c5dea5e9e": -44.455
        },
        {
          "dataSeries": "line",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991": "里斯",
          "1c15cc6f-629c-4a33-956a-c2af8e21c991-originData": "里斯",
          "e3ed695a-98a2-4c4d-99f7-cd0c5dea5e9e": 65.1111
        }
      ]
    }
  ],
  "series": [
    {
      "type": "bar",
      "id": "bar",
      "dataIndex": 0,
      "animation": false,
      "xField": [
        "1c15cc6f-629c-4a33-956a-c2af8e21c991"
      ],
      "yField": "86252231-6298-4c4f-8c50-968849d86a6e",
      "barMaxWidth": 48,
      "barMinWidth": 8,
      "bar": {
        "style": {
          "cursor": "pointer"
        },
        "state": {
          "hover": {
            "stroke": "#3370FF",
            "lineWidth": 1
          },
          "legend_hover": {
            "stroke": "#3370FF",
            "lineWidth": 1
          }
        }
      },
      "label": {
        "visible": true,
        "position": "inside",
        "offset": 0,
        "smartInvert": {
          "contrastRatiosThreshold": 2
        },
        "style": {
          "fontSize": 12,
          "lineHeight": 20,
          "fontWeight": 700,
          "fontFamily": "DIN Pro, PingFang SC",
          "stroke": ""
        },
        "overlap": {
          "hideOnHit": false,
          "clampForce": false,
          "strategy": [
            "bound",
            "moveY"
          ]
        }
      }
    },
    {
      "type": "area",
      "id": "line",
      "dataIndex": 1,
      "animation": false,
      "xField": [
        "1c15cc6f-629c-4a33-956a-c2af8e21c991"
      ],
      "yField": "e3ed695a-98a2-4c4d-99f7-cd0c5dea5e9e",
      "stack": false,
      "point": {
        "style": {
          "size": 6,
          "fill": "#ffffff",
          "lineWidth": 2,
          "cursor": "pointer"
        },
        "state": {
          "dimension_hover": {
            "size": 8
          },
          "hover": {
            "size": 8,
            "outerBorder": {
              "distance": 2,
              "lineWidth": 3,
              "strokeOpacity": 0.2
            }
          },
          "legend_hover": {
            "size": 8
          }
        }
      },
      "seriesMark": "line",
      "area": {
        "interactive": false,
        "visible": true,
        "style": {}
      },
      "label": {
        "visible": true,
        "offset": 1,
        "style": {
          "fontSize": 12,
          "lineHeight": 20,
          "fontWeight": 700,
          "fontFamily": "DIN Pro, PingFang SC",
          "stroke": ""
        }
      },
      "line": {
        "style": {
          "curveType": "monotone",
          "cursor": "pointer"
        }
      }
    }
  ],
  "region": [
    {
      "style": {
        "cursor": "pointer"
      }
    }
  ],
  "axes": [
    {
      "orient": "left",
      "seriesId": [
        "bar"
      ],
      "id": "axisLeft",
      "expand": {
        "max": 0.2
      },
      "title": {
        "text": "整数",
        "visible": true,
        "style": {
          "fill": "#646A73",
          "fontSize": 12,
          "lineHeight": 20,
          "maxLineWidth": 234
        },
        "space": 8
      },
      "label": {
        "visible": true,
        "space": 8,
        "style": {
          "fill": "#646A73",
          "fontSize": 12,
          "lineHeight": 20,
          "maxLineWidth": 174.5
        }
      },
      "grid": {
        "visible": true,
        "style": {
          "lineDash": [
            3,
            3
          ],
          "stroke": "rgba(31, 35, 41, 0.10)",
          "lineWidth": 1
        }
      }
    },
    {
      "orient": "right",
      "seriesId": [
        "line"
      ],
      "expand": {
        "max": 0.2
      },
      "sync": {
        "axisId": "axisLeft",
        "tickAlign": true
      },
      "visible": true,
      "title": {
        "text": "浮点数",
        "visible": true,
        "style": {
          "fill": "#646A73",
          "fontSize": 12,
          "lineHeight": 20,
          "maxLineWidth": 234
        },
        "space": 8
      },
      "label": {
        "visible": true,
        "space": 8,
        "style": {
          "fill": "#646A73",
          "fontSize": 12,
          "lineHeight": 20,
          "maxLineWidth": 230.34
        }
      },
      "grid": {
        "visible": false
      }
    },
    {
      "orient": "bottom",
      "tick": {
        "visible": false
      },
      "sampling": false,
      "title": {
        "text": "文本",
        "visible": true,
        "style": {
          "fill": "#646A73",
          "fontSize": 12,
          "lineHeight": 20,
          "maxLineWidth": 467.66
        },
        "space": 4
      },
      "label": {
        "visible": true,
        "autoRotate": true,
        "autoHide": false,
        "autoRotateAngle": [
          0,
          45
        ],
        "space": 6,
        "style": {
          "fill": "#646A73",
          "fontSize": 12,
          "lineHeight": 20,
          "maxLineWidth": 202.8
        }
      },
      "paddingInner": 0.5
    }
  ],
  "tooltip": {
    "className": "apaas-chart-tooltip-wrapper",
    "visible": true,
    "mark": {
      "content": {}
    },
    "dimension": {},
    "minWidth": 120,
    "style": {
      "spaceRow": 6,
      "keyLabel": {
        "lineHeight": 20,
        "fontSize": 12,
        "fontColor": "#646A73",
        "textAlign": "left"
      },
      "valueLabel": {
        "lineHeight": 20,
        "fontSize": 12,
        "fontColor": "#646A73"
      },
      "titleLabel": {
        "fontSize": 12,
        "lineHeight": 20,
        "fontWeight": 400,
        "fontColor": "#1F2329"
      },
      "panel": {
        "padding": {
          "top": 10,
          "bottom": 10,
          "left": 12,
          "right": 12
        },
        "border": {
          "color": "#EFF0F1",
          "width": 1,
          "radius": 6
        },
        "shadow": {
          "x": 0,
          "y": 4,
          "blur": 16,
          "spread": 4,
          "color": "#1F232908"
        }
      },
      "shape": {
        "size": 8,
        "spacing": 5
      }
    }
  },
  "crosshair": {
    "xField": {
      "visible": true,
      "line": {
        "type": "rect",
        "width": "200%",
        "style": {
          "background": "#1F2329",
          "fillOpacity": 0.05
        }
      }
    }
  },
  "legends": {
    "visible": true,
    "interactive": true,
    "allowAllCanceled": true,
    "orient": "bottom",
    "position": "middle",
    "padding": {
      "top": 12
    },
    "maxRow": 1,
    "pager": {
      "padding": 0,
      "space": 0,
      "animation": false,
      "handler": {
        "space": 4,
        "preShape": "M -0.1855 0.0116 C -0.1981 0.0016 -0.1981 -0.0176 -0.1855 -0.0276 L 0.075 -0.237 C 0.0914 -0.2503 0.116 -0.2385 0.116 -0.2174 V 0.2014 C 0.116 0.2225 0.0914 0.2343 0.075 0.221 L -0.1855 0.0116 Z",
        "nextShape": "M 0.1695 -0.0172 C 0.1821 -0.0071 0.1821 0.012 0.1695 0.0221 L -0.091 0.2315 C -0.1075 0.2447 -0.132 0.233 -0.132 0.2118 L -0.132 -0.2069 C -0.132 -0.2281 -0.1075 -0.2398 -0.091 -0.2265 L 0.1695 -0.0172 Z",
        "style": {
          "fill": "#8F959E",
          "size": 7
        },
        "state": {
          "hover": {
            "fill": "#336DF4"
          },
          "disable": {
            "fill": "#BBBFC4"
          }
        }
      },
      "textStyle": {
        "fill": "#8F959E",
        "fontSize": 12,
        "lineHeight": 20
      }
    },
    "item": {
      "spaceCol": 16,
      "spaceRow": 4,
      "background": {
        "visible": false
      },
      "label": {
        "style": {
          "fontSize": 12,
          "lineHeight": 20,
          "maxLineWidth": 102.96000000000001,
          "fill": "#646A73"
        }
      },
      "shape": {
        "space": 4,
        "state": {}
      }
    }
  },
  "dataZoom": []
}
const vchart = new VChart(spec, { dom: CONTAINER_ID });
vchart.renderAsync();

// Just for the convenience of console debugging, DO NOT COPY!
window['vchart'] = vchart;