how to make polyline annotation in column chart?

[d0ublezer0]

Hello I want to make polyline, connecting columns, like this:

https://ant-design-charts.antgroup.com/en/examples/statistics/tiny#column-annotation
sorry, stackblitz and codesanbox won't work with example, you can copy paste code below at this link

Playing on ant chart example, i made this code, but line reacts to interactions, how to avoid interacting?

import React from 'react';
import ReactDOM from 'react-dom';

const DemoLine = () => {
  const data = [
    264, 417, 438, 887, 309, 397, 550, 575, 563, 430, 525, 592, 492, 467, 513, 546, 983, 340, 539, 243, 226, 192,
  ].map((value, index) => ({ value, index }));
  const config = {
    data,
    width: 480,
    height: 180,
    padding: 8,
    xField: 'index',
    yField: 'value',
    scale: {
      y: {domainMax: 1400}
    },
    annotations: [
      {
        type: 'line',
        xField: 'index',
        yField: 'value',
      
        data: [
          {index: 3, value: 887},
          {index: 3, value: 1000},
          {index: 7, value: 1000},
          {index: 7, value: 575},
          ],
        style: { arrow: true, stroke: 'red', lineDash: [2, 2] },
      },
    ],
  };
  return <Tiny.Column {...config} />;
};

ReactDOM.render(<DemoLine />, document.getElementById('container'));

[lxfu1]

Your code has already achieved your requirements. I don't understand what you're trying to achieve.