8

I'm trying to highlight areas of an image like how you would on your mac or windows by dragging an area with the mouse in a React.js application.

I understand this would be best done on Canvas, by overlaying the canvas over the image, and then catch the mouse events and drawing the rectangle accordingly, is there a good library or something to do this? because writing raw code to implement this seem to be reinventing the wheel.

Thanks in advance.

Saifis
  • 2,197
  • 1
  • 22
  • 36
  • I don't have experience with either but there's also [react-rectangle-selection](https://github.com/remigallego/react-rectangle-selection) and [react-selectable](https://github.com/unclecheese/react-selectable) – Dror Bar Feb 14 '21 at 08:31

2 Answers2

1

Not sure if this is enough to warrant a full answer but I ran into a similar situation and this library is the best I could find:

react-sketch

Admittedly though it seems the maintainer is very unresponsive/not maintaining the package which is a bit concerning.

Hope this helps :)

wootencl
  • 585
  • 4
  • 15
0

There are some libraries .

you can choose https://daybrush.com/scena/

and some paid libraries

Azim Uddin Ahamed
  • 21
  • 2
  • While this link may answer the question, it is better to include the essential parts of the answer here and provide the link for reference. Link-only answers can become invalid if the linked page changes. - [From Review](/review/late-answers/33317226) – Alvin Dec 06 '22 at 19:52