Whether you need just a small section of a shape or the entire width and height of the view, getting snapshot images is quite straightforward once you know a couple of tricks - lets take a look at them...
So there you are with a shiny new group - with a couple of shapes added to it. Now you want to drag the group. Click-dragging the shapes will move the Group, but click-dragging the empty space doesn't - what gives?
The Konva group is a bit hard to pin-down, almost a normal shape but not quite. Its super-powers can be a bit challenging though once you understand a few fundamentals its got your back. Lets dive in...
The Konva transformer is brilliant at handling what would otherwise take a whole bunch of work to copy. But people either overthink it or don't know its full power and tunability. So lets investigate...
Using the click-drag-rect patterns to add or select objects visually is a staple of graphics UX - this is one way to do it with Konva. The trick is to keep everything relative to the stage. Lets take a look...
Konva's clipFunc is usually used to trim off the edges of oversize images. The magic here is that if we draw an outer path clockwise and an inner path counter-clockwise, the area defined by the inner path becomes a hole! Let's look into it...
It's easy to find out that to flip an image we can set the scaleX or Y to -1. But there's a problem here because images are based on the rect and have their origin at (0, 0). To make a proper in-place flip we have a little more work to do. Lets take a look...