javascript - CSS transformOrigin プロパティが期待どおりに機能しない

Question

クリックしたときにズームする必要があるいくつかの領域を含む svg があります。CSS の transformOrigin プロパティを使用して、マウス クリックの座標に設定したので、この点を中心に画像を拡大縮小できます。代わりに、svg がスケーリングされると、クリックしたポイントから数ピクセルだけオフセットされます。私がここに欠けているものはありますか？

$(document).ready(function(){   
$('g').click(function(e){
        var x = e.clientX;
        var y = e.clientY;
        $('g.states').css({'transformOrigin': x+' '+y});
        $('g.states').transition({scale: "2"});     
    })
    $('#zoomout').click(function(){
        $('g.states').transition({scale:"1"});
    })
});

この.transitionメソッドは、jquery トランジットライブラリの一部です。