Firefoxのd3のヒントツールチップ、IE

Question

私は円に添付されたd3 line graphsとtipsy tooltipsです。

Chrome/Safariではツールチップがうまく機能しますが、ポイント上にカーソルを置いたときにツールチップが正常に機能しますが、それぞれのツールチップが表示されている間は画面の左上隅のグラフ/ SVG要素の外に表示されますhtml要素）を指定します。

jQuery('g circle').tipsy({ 
     gravity: 'w', 
     html: true, 
     title: function() { 
      return this.textContent; 
     } 
    }) 

私が間違ってやって上の任意のアドバイスをいただければ幸いです。

これは私がツールチップを装着しています方法です。

Answer 1

tipsyはoffsetWidthとoffsetHeightを要素に使用します。このようなことはSVGの要素で動作すると仮定していますが、残念ながらその仮定はChrome/Safariの外部では間違っています。

CSSOM仕様では、offsetWidth/offsetHeightはhtml要素プロパティです。クロム/サファリはこれらをSVG要素に入れているようですが、そのように指定する必要はありません。

ブラウザをクロスブラウザにするか、作成者に指示する必要があります。おそらく、getTransformToElementまたはgetBBoxを使用することが必要です。

Answer 2

ThisパッチはTipsyに適切なSVGサポートを追加します。