ブートストラップのツールチップをSVGの中心に置くにはどうすればいいですか？

Question

カーソルがあるセルの中心に矢印があるように（現在は、（0,0）、すなわち左上に位置しています）、ツールチップを右に数ピクセル移動します。これは私のコードです：

$("rect.cell").tooltip({ 
    title: "hola", 
    placement: "top" 
    }); 

と画像：

理想的には私はこの使用してJavaScriptを行うにはしたいと思いますので、私はセルのサイズを変更する場合、私は、画素数を更新することができます。

Answer 1

はここで、通常のHTML要素とSVG要素の両方をサポートしていnachocabのgetPosition実装の単純な拡張です：

getPosition: function (inside) { 
    var el = this.$element[0] 
    var width, height 

    if ('http://www.w3.org/2000/svg' === el.namespaceURI) { 
     var bbox = el.getBBox() 
     width = bbox.width 
     height = bbox.height 
    } else { 
     width = el.offsetWidth 
     height = el.offsetHeight 
    } 

    return $.extend({}, (inside ? {top: 0, left: 0} : this.$element.offset()), { 
    'width': width 
    , 'height': height 
    }) 
} 

Answer 2

ので、私はちょうどこのことから、ブートストラップ・tooltip.jsを変更https://bugzilla.mozilla.org/show_bug.cgi?id=649285

（私の場合のように）SVG要素のためのFirefox/Chromeのバグに表示されます。これに

getPosition: function (inside) { 
    return $.extend({}, (inside ? {top: 0, left: 0} : this.$element.offset()), { 
    width: this.$element[0].offsetWidth 
    , height: this.$element[0].offsetHeight 
    }) 
} 

を：

getPosition: function (inside) { 
    return $.extend({}, (inside ? {top: 0, left: 0} : this.$element.offset()), { 
    width: this.$element[0].getBBox().width 
    , height: this.$element[0].getBBox().height 
    }) 
} 

Answer 3

私はポジショニングがChromeでグラグラだった（適切な高さが、はるかにSVGの左側に位置：RECT要素）とFirefox（適切な高さ、完全に間違ったx位置）。 （それはすべての私の結果を投げた場合はわからない）私はjQueryのためsvgdomプラグインを使用していのだが、ここで私が思いついた解決策があります：

https://gist.github.com/2886616

それを組み合わせboostrap.jsに対する差分です。ここでは他の誰かが、ブートストラップに対して提出することを長期休止中の問題だ：

https://github.com/twitter/bootstrap/issues/2703