Removing objects from a layer using KineticJS

Question

I am currently working a project involving KineticJS.

I have to dynamically create and delete shapes constantly, but cannot seem to figure out how to do the latter. I've been trying to do:

 $ myLayer.remove(myShape)

because this is what most posts seem to recommend. But, the documentation says that this will remove the layer from the stage and not the shape from the layer. When I try this in project it in fact removes the layer from the stage.

So am I doing something wrong or is there some other way to remove a shape from a layer?

Mindful

I don't know if there is a better way, but after reading some of the kinetic js code. I found if I do myShape.remove() the shape gets removed from the layer. – Mindful

Answer 1

There are two functions that may be helpful.

• childContainer.remove() removes the childContainer from it's parent.
• parentContainer.removeChildren() removes all the children from this container.

Edit: This can also apply to shapes. Simply redraw the layer.

myShape.remove();
myLayer.draw();

Chantel

thanx, i just wanted to know this! found out that you don´t even need to redraw the layer, after calling remove it´s gone immediately. – Dulaney

How to restore it again?? – Concussion

@MahdiAlkhatib if you still have a reference to the children then simply add them to the layer / container – Chantel

So if there are no variable pointing to it, it will be destroyed (garbage collected)?? – Concussion

Answer 2

Somewhere between Kinetic 4.0 and the latest version, remove(child) stopped working. removeChild(child) doesn't work either.

I resolved this problem by using child.remove();

Damocles

Answer 3

U can use the prototype of kinetic function

Kinetic.Node.prototype.remove.call(removed_object);

baselayer.draw();

Veinstone