ブートストラップポップオーバーが中央に配置されています

Question

私はハイライト付きのインタラクティブなSVGマップを作成しています。今私はブートストラップポップオーバーを使用していますが、それはsvgの上に揃えられています。私が欲しいのは、それを真ん中の何かの中のsvgの上に置くことです。

FIDDLEはどのようにビルドアップを参照してください。

フィドルでわかるように、私はsvg要素のポップオーバーをトリガーします。

この特定のポップオーバーにはどうすればアクセスできますか？私はすべての準備がソリューションはdiv要素でSVGをラップし、与えた

$('svg').click(function(){ 
    $('div').find('.popover').css('top', '100px','!important'); 
}) 

しかし、あなたは二時間（ときそのクロージング）

Answer 1

をクリックしたとき、それは100pxににトップを設定しているよりも、私はこのように考えていましたそれはposition: relativeおよびdisplay: inline-blockを与えるよりもpopover class:

.popover { 
     .pos-t-l(50%, 50%) !important; (mixin position top-left) 
     .translate(-50%; -50%); 
    }`