timdream / wordcloud2.js

Tag cloud/Wordle presentation on 2D canvas or HTML
https://wordcloud2-js.timdream.org/
MIT License
2.36k stars 511 forks source link

Hover over word element broken for non HTML5 canvas word clouds #26

Open JacquiManzi opened 10 years ago

JacquiManzi commented 10 years ago

I am getting a Uncaught TypeError: Cannot read property 'NaN' of undefined when using the hover callback.

Digging into the code I see this:

var getInfoGridFromMouseEvent = function getInfoGridFromMouseEvent(evt) {
      var canvas = evt.target;
      var rect = canvas.getBoundingClientRect();
      var eventX = evt.clientX - rect.left;
      var eventY = evt.clientY - rect.top;

      var x = Math.floor(eventX * (canvas.width / rect.width) / g);
      var y = Math.floor(eventY * (canvas.height / rect.height) / g);

      return infoGrid[x][y];
    };

In my particular case, var canvas = evt.target; is not an HTML5 canvas element and does not have a .width or .height property. This does work if I place my word cloud in an HTML5 canvas, however.

timdream commented 10 years ago

Yes, hover only works with an word cloud on canvas. You don't need that callback if you are using HTML I think.

You are free to either fix it or update the documentation (if I didn't add it). Thanks.

JacquiManzi commented 10 years ago

I updated the documentation and will look into a fix when I get the chance, thanks for the reply!

timdream commented 10 years ago

Merged in #29.

I am tempted to close this as WONTFIX but let's leave it open for now.

timdream commented 10 years ago

Thank you for your pull request BTW!