Annotation is registering my click outside of the chart, is there way to disable it from registering click outside of the chart?

Answered

Codesandbox link: https://codesandbox.io/p/sandbox/vertically-stacked-axes-forked-pd3h7g?file=%2Fsrc%2FApp.tsx%3A133%2C25

I put the first box annotation to be from -5 to 6 and the x-axis range is from 0 to 10, so that mean some portion of the first box annotation is out of the chart. And there is a click event on the box annotation and console log whenever it is clicked on, and when I click outside of the chart box/square and align it to the box annotation, it is registering the click.

Version

3.2.446

Images

JavaScript Annotation click Box Annotation onclick

Nung Khual asked 9 months ago

You must login to post comments

Answers (1)

Best Answer

For now, use this CustomAnnotation which does a seriesViewRect check first:

class CustomBox extends BoxAnnotation {
  protected checkIsClickedOnAnnotationInternal(x: number, y: number): boolean {
    // coordinate parameters have already been transformed to be relative to the seriesViewRect
    if (x < 0 || x > this.parentSurface.seriesViewRect.width) {
      return false;
    }
    if (y < 0 || y > this.parentSurface.seriesViewRect.height) {
      return false;
    }
    return super.checkIsClickedOnAnnotationInternal(x, y);
  }
}

Updated codesandbox: https://codesandbox.io/p/sandbox/vertically-stacked-axes-forked-9y4w4h

We will discuss internally whether this is a bug or whether it needs to be an option on annotations.

Regards
David