Konva get image ID from click event

Question

I am trying to get the ID of the image I am clicking on by using the following code:

theImg.on('click', function() {
    alert($(this).attr('id')); //Should show 'IDofImg'
});

The Konva code is this:

var theImg = new Konva.Image({
    image: imageObj,
    x: stage.getWidth() / 2 - 200 / 2,
    y: stage.getHeight() / 2 - 137 / 2,
    opacity: 0.8,
    shadowColor: 'black',
    shadowBlur: 5,
    id: 'IDofImg',
    shadowOffset: {
        x: 0,
        y: 0
    },
    startScale: 1,
    shadowOpacity: 0.6,
    draggable: true
});

As you see, I have id: 'IDofImg', within the making of the image but it seems not to output the needed ID.

It currently outputs this when clicked on:

function() {
   // setting
   if (arguments.length) {
       this[setter](arguments[0]);
       return this;
   }
   // getting
   else {
       return this[getter]();
   }
}

What am I missing?

Fiddle here

Yep, **this.id()** did get the image ID just fine. Please make that the official answer so that I can give you proper credit for it. — StealthRT, Oct 05 '15 at 14:58

score 2 · Accepted Answer · answered Oct 05 '15 at 15:02

2

You should use this.id() because it is the Konva Image object, and not an html/javascript object.

See also the docs: http://konvajs.github.io/api/Konva.Node.html#id

answered Oct 05 '15 at 15:02

Niki van Stein

10,564
3
29
62

Konva get image ID from click event

1 Answers1