How to show tooltip following mousemove?

[vicn1222]

Hi,

I am trying to display plotly (x, y) coordinate on upper left corner of the plot following mousemove. I have add the below codes. How can I display the (x, y) coordinate like hovermode = 'closest', or display the coordinates on browser's status bar?

Many thanks

function handleMouseMove( evt ) 
{
  var left = this._fullLayout.margin.l;
  var top = this._fullLayout.margin.t;
  var xaxis = this._fullLayout.xaxis;
  var yaxis = this._fullLayout.yaxis;
  var xpos = xaxis.p2c( evt.offsetX - left );
  var ypos = yaxis.p2c( evt.offsetY - top );
  var tipText = 'x: ' + xpos + ', y: ' + ypos;

  // how to show the tipText on upper left corner of the plot, or better yet, display it in the browser's status bar?
}

function handleMouseOut( evt )
{
  // hide the tooltip?
}

gd.addEventListener( 'mousemove', handleMouseMove );
gd.addEventListener( 'mouseout', handleMouseOut );