KineticJS - update text layer with new mouse position

Question

I am using the following to get the mouse position:

  var coordinate = 0;
............
           canvas1.addEventListener(\'mousemove\', function (evt) {
               


        

Answer 1

[Edited – again! Sorry about my incomplete answer last night – I was sleepy!]

To get a Kinetic Text to display coordinates of mouse movements on the stage…

The stage itself does not emit mouse events, but we can use stage.getContent to get the stage’s DIV so we can listen for mouse events on that div:

$(stage.getContent()).on('mousemove', function(event){ onMousemove(event)}); 

Then in the onMousemove handler, we can get the coordinate of the mouse on the stage:

var pos=stage.getMousePosition();
var mouseX=parseInt(pos.x);
var mouseY=parseInt(pos.y);

And finally we update the kinetic text to show that coordinate:

simpleTextRight.setText("Mouse: x="+mouseX+", y="+mouseY);

Here is code and a Fiddle: http://jsfiddle.net/m1erickson/KamDV/