-1

I'm facing an issue with konvajs. I am able to draw things and they save all fine to be played with the end video.

However, Let's say I pause the video at 0:30 to add a circle and save it, and then I want to add another shape at 01:30, as soon as I start adding another shape the circle I added before also shows up on screen. So everytime I try and add a shape, I can see all the previous shapes on the screen.

Note: Problem is in adding the shapes, the end video plays fine (circle at 0:30 and another shape at 01:30). Is there any event that I can call to avoid this? Any help will be appreciated.

Jagatveer Singh
  • 185
  • 2
  • 12
  • Please post a [Minimal, Complete, and Verifiable example](https://stackoverflow.com/help/mcve) of your issue. Do not link to full code elsewhere as such links are liable to break over time. You are asking busy experts to invest their time to help you - respect this and explain your issue clearly. As well-meant advice, it is most likely that this is a bug of your own making as Konvajs generally works fine. – Vanquished Wombat Nov 21 '18 at 09:45
  • @VanquishedWombat That was meant to give details, not waste anyone's time. Hope the following is worth answering? Even if I call to hide or reduce the opacity to 0 while adding another object. How do I avoid saving visibility change?? Or can you recommend another alternate for videos to handle this UX challenge in a better way? – Jagatveer Singh Nov 21 '18 at 09:56
  • How are you saving the canvas contents? – Vanquished Wombat Nov 21 '18 at 09:59
  • I get element data in the canvas and save it directly, this is why I got the thought that it might try to capture the hide or opacity change too :/ small gist if you want to have a look https://gist.github.com/Jagatveer/318c6ff3643d7bbd15b3749c03796f2f – Jagatveer Singh Nov 21 '18 at 10:34
  • Overall, canvas has no timeline - you will need to handle the show/hide yourself. – Vanquished Wombat Nov 21 '18 at 10:47

1 Answers1

1

When you add a shape into the layer, you just need to hide/remove previous shapes.

You can do something like this:

oldShape.destroy();
// or remove all previous shapes
layer.destroyChildren();
// then
layer.add(newShape);
layer.draw();
lavrton
  • 18,973
  • 4
  • 30
  • 63