how to set two rect with 2 zIndex? about react-konva

[lavrton]

zIndex of Konva.Node is just current index of the node in its parent. Not like CSS property.
So you just need to place them in the correct order. Rect with zIndex = 5 first then another one.

[lavrton]

You need to have a state with an array of rectangles. Instead of setting zIndex, you just need move them in the array and then render.

[lavrton]

Ok. Looks like zIndex is confusing in react-konva. We should add a warning when someone trying to use it.
It is totally good to use zIndex in pure Konva. But it has no sense in react-konva, because for a correct order you just need to correctly define render function.

[bay007]

Hi @lavrton ; you talk about this?
<Rect zIndex = {5} name="top-right" x={width - size / 2} y={-size / 2} {...attributes} />

[bay007]

I want to perform like that this
https://konvajs.github.io/docs/groups_and_layers/Layering.html in react, I think cant be make only defining render function.

[lavrton]

Using zIndex manually with react-konva is antipattern because react-konva will reset the order of nodes on a component update.

[bay007]

@lavrton Thanks a lot, I going to try with your comment, I will write my comments about this.

[bay007]

Amazing.... that works for me...

[lavrton]

https://konvajs.org/docs/react/zIndex.html

[noumankhan95]

yes but what if i have many icons and shapes on my canvas , and im trying to move an icon over a circle shape ?