CODEWITHSUNDEEP
javascriptkineticjs
Cédric Christinaz
Cédric Christinaz

Reputation: 11

kinetic drag text


With Kinetic, is it possible to set a mouseover on a text? The code below does not work. If a replace the Text by a Rectangle, it works fine.

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

var test = new Kinetic.Text({
    x: 20,
    y: 20,
    text: "test",
    textFill:"black"
});

test.on("mouseover", function(){
    alert("mouseover");
});

layer.add(test);

Thank you for your help!

UPDATE:

Ok, I searched a little bit more and it seems that it is necessary to use pixel detection.

see this tutorial fore more details

The result is not perfect for the moment but it is better than nothing.

Upvotes: 1

Views: 718

Answers (1)

nachoorme
nachoorme

Reputation: 534

I have trouble dealing with a similar text behaviour and after diving in repository history I found that now Text has detectionType setted to 'pixel' by default.

Try to change your Text declaration like following :

var test = new Kinetic.Text({
    x: 20,
    y: 20,
    text: "test",
    textFill: 'black',
    detectionType: 'path',
    draggable: true         
});

Upvotes: 3

Related Questions