Search code examples
konvajs

Konvajs layer positions not being set as expected

I have an app where I am panning and zooming multiple layers.

However, when I set the position of the layers they are being updated to the wrong values.

For instance, after calling:

layer.position({
    x: 12,
    y: 233,
});

I would expect

layer.getClientRect();

to return

{
  x: 12,
  y: 233,
}

Instead it returns

{
  x: -22,
  y: 220,
}

Is there any known reason this is happening?

Solution

  • I realised I wasn't taking into account all the offsets. The x position of a circle is set from the centre while getClientRect() returns the width and height including negatives. So getClientRect() on a circle with a radius of 50 and x of 0 will actually return {x: -25, y: -25, width: 50, height: 50}.