How to make crop in konvajs to work like Transformer
what i mean:
trigger some checkbox to set it on crop
select item(image) on canvas it should show box that can be resize changed position on this item only
than clicking on button makes crop
i can`t get throught 2nd point rest is quite easy
thanks for every answer
This is a broad question, so here's a broad response focused on approach for each step.
A Konva Rect shape can used to indicate the cropping frame. It would be transparent fill, drawn over the image. The Konva Rect shape would be draggable, with a drag function that limits the x,y position so that it cannot be dragged over the edge of the image (i.e. so that is always inside or butting against an edge of the image, never overlapping an edge). The initial size and shape of the Rect could conform to whatever restrictions you are imposing or to the current image size and shape.
In each corner and in each side of the cropping frame, create handles with other Konva Rect shapes. Each one would be draggable with a drag function that is limiting the drag position to the axis and the connected edge(s) and to the bounds of the image and the minimum size of the cropping frame. The drag function would also be used to update the cropping frame position/size so that the edges match the position of the handle.
You then can use the cropping frame position/size to determine where to crop the image.
For added user feedback, you could also apply a filter inside or outside the cropping frame to dim, lighten or darken what is being cropped by using a semi-transparent rect or one of the filters. Alternatively you can use the clipping feature. https://konvajs.github.io/docs/clipping/Clipping_Regions.html