konvajs / konva

Konva.js is an HTML5 Canvas JavaScript framework that extends the 2d context by enabling canvas interactivity for desktop and mobile applications.
http://konvajs.org/
Other
11.43k stars 918 forks source link

Clip on group not working with width: 0 and height: 0 #1723

Closed matkokvesic closed 7 months ago

matkokvesic commented 7 months ago

Clip group with child elements should not show anything with following attrs:

let widthValue = 0;
let heightValue = 0;
group.setAttrs({
  clip: {
    x: 0,
    y: 0,
    width: widthValue,
    height: heightValue,
  },
});

https://codesandbox.io/p/sandbox/konva-playground-forked-c2x4hl

Seems like clip attrs are ignored if width and height are 0.

Alternative is to use corresponding clipFunc:

let widthValue = 0;
let heightValue = 0;
group.clipFunc((ctx) => {
        ctx.rect(0, 0, widthValue, heightValue)
      });
lavrton commented 7 months ago

Released a fix.