draw multiple lines and delete individual line - draw

Question

I can draw multiple lines on the canvas; they are added to the layer using drawScene
dlayerA1.add(line);
line.getPoints()[0].x = mousePos.x;
line.getPoints()[0].y = mousePos.y;
line.getPoints()[1].x = mousePos.x;
line.getPoints()[1].y = mousePos.y;
moving = true;
dlayerA1.drawScene();
http://jsfiddle.net/user373721/xzEad/1/.
Is there a way to delete individual line?

Answer 1

Currently, you'll have to modify the points array like this:
line.getPoints()[0].splice(index, 1);
Since arrays are modified by reference, modifying the returned array modifies the "source of truth" points array attr

Answer 2

I assigned a unique id to each object and used the following to delet it when click on it:
r = r + 1;
var mousePos = stage1.getMousePosition();
rectA1 = new Kinetic.Rect({
x: mousePos.x - rOffset,
y: mousePos.y - rOffset,
width: 0,
height: 0,
stroke: 'red',
strokeWidth: 4,
id:"rectA" + r
});
rectA1.setListening(true);
myRect1[r] = rectA1;
background1.add(myRect1[r]);
//start point and end point are the same
rectA1.setX(mousePos.x - rOffset);
rectA1.setY(mousePos.y - rOffset);
rectA1.setWidth(0);
rectA1.setHeight(0);
moving = true;
background1.drawScene();
myRect1[r].on("click", function () {
this.remove();
});
My solution is based on this good answer: How to select an object in kinetic.js?