Hopefully a simple question here:

Say I've used KineticJS to draw a line as follows:

var redLine = new Kinetic.Line({
      points: [73, 70, 340, 23, 450, 60, 500, 20],
      stroke: "red",
      strokeWidth: 15,
      lineCap: "round",
      lineJoin: "round"
    });

And it's been added to a layer which has been added to the stage.

But now I need to pletely remove this line as if it was never there to react to some user event. How do I go about doing this?

Hopefully a simple question here:

Say I've used KineticJS to draw a line as follows:

var redLine = new Kinetic.Line({
      points: [73, 70, 340, 23, 450, 60, 500, 20],
      stroke: "red",
      strokeWidth: 15,
      lineCap: "round",
      lineJoin: "round"
    });

And it's been added to a layer which has been added to the stage.

But now I need to pletely remove this line as if it was never there to react to some user event. How do I go about doing this?

• javascript
• html
• canvas
• kineticjs

4 Answers 4

container.remove() removes this from it's parent container, while container.removeChildren() removes all the children from this container. Neither of them accepts any parameter.

remember to redraw the layer after you remove it.

layer.remove() removes your layer... To remove a single shape, use shape.remove(), I can't find it documented anywhere... but apparently it works...

My best solution was to use one simple method: shape.hide(); This methods hides the shape and this "removes" it from your drawing, you won't see it anymore, but I think the shape is still there, not pletely sure.

let's say you have a layer like below:

var layer = new Kinetic.Layer(....);

to remove your redLine from the layer write:

layer.remove(redLine);