Include zIndex data when exporting canvas to json about pikaso HOT 7 CLOSED

Thanks.

from pikaso.

Hi @ehussain

There are two ways to access Konva shapes through Pikaso.
An example will help me to explain

const circle = editor.shapes.circle.insert({ 
  /* config */
})

here circle.node has access to the Konva shape.
So in your case circle.node.zIndex(1) is the solution.

The second way is using update method that is provided by Pikaso.

circle.update({
  zIndex: 1
})

from pikaso.

Hello @raminious

Thanks for quick response. This is very helpful. I was able to adjust zindex of shapes using shape.update({zIndex: 1}) method as you have mentioned.

However I am still facing the issue in following scenario.

1. let imageShape = editor.shapes.image.insert(ImageURL) - Inserts Image URL
2. let labelShape = editor.shapes.label.insert({}) - Inserts "Untitled Text"
3. labelShape.update({zIndex : 99}) // making sure label remains on top and it shows properly
4. let json = editor.export.toJson();
5. editor.reset() // reset canvas
6. editor.import.json(json) // load previous json again

After doing above steps there is issue where image always takes top place and label gets hidden behind image.

Thanks in advance.

from pikaso.

Ok, let me try to reproduce the scenario

from pikaso.

@ehussain I could reproduce the bug https://codesandbox.io/s/floral-field-o4op8c?file=/src/index.ts

Pikaso relies on Konva's toObject method when exporting the board to JSON. in this case Konva doesn't return zIndex with created object of toObject
This is a Konva bug, and I think they should fix it, but I'll fix it myself in Pikaso since Konva does not support exporting to JSON.

from pikaso.

@ehussain
The issue has been fixed and with v2.6.0 will be released this week.
I appreciate your contribution.

from pikaso.

released https://github.com/pikasojs/pikaso/releases/tag/v2.6.0

from pikaso.