layerchart icon indicating copy to clipboard operation
layerchart copied to clipboard
verified publisher icon techniq

[Annotations] Refinements

Open techniq opened this issue 7 months ago • 2 comments

  • AnnotationRange
    • Rename to AnnotationArea
  • AnnotationLine
    • Support slopped lines (with rotated labels) via x2 / y2 props (but not required)

techniq avatar May 20 '25 12:05 techniq

Hi! I am very interested in the sloped line feature, is there currently a way to interactively drag the mouse on a scatter plot to draw a sloped line over it going through the start & end drag points?

Use case: I need my users to look at a scatter plot of points following some trends, and the users need to annotate a linear trend on the curve. I need them to drag their mouse to draw the slope, and get the start & end points once the drag is over. Thanks!

MadeInPierre avatar May 27 '25 14:05 MadeInPierre

Hi @MadeInPierre 👋. There is not anything directly built into LayerChart for this user annotation functionality but it is possibly to accomplish in user land by setting up an element (such as a <rect> to receive the pointer events (onpointerdown, onpointermove, onpointerup) that you could use to setup this interaction.

You might get some inspiration from the Draggable Arc and Force Text examples

techniq avatar May 27 '25 16:05 techniq