在svg-canvas中定位轉換後的SVG元素

我寫過一個函數，它將調整SVG路徑或任何形狀的大小。但是，當我使用它的路徑確實會調整大小，但不幸的是它也改變了我的svg畫布中的位置。在svg-canvas中定位轉換後的SVG元素

這是我的功能

function output() 
    { 
     var transformw=prompt("Enter your new width"); 
     var transformh=prompt("Enter your new height"); 
     var lastw = svg_1.getBoundingClientRect().width; 
     var lasth = svg_1.getBoundingClientRect().height; 

     newW=transformw/lastw; 
     newH=transformh/lasth; 
     alert(newH); 
     alert(newW); 

     svgCanvas.changeSelectedAttribute("transform", 
      "matrix(" + newW + ", 0, 0, " + newH + ", 0, 0)"); 

     svgCanvas.recalculateAllSelectedDimensions(); 
    }

我只想形狀被定位在我的畫布的右上角，一旦他們得到轉化。理想情況下，我希望他們在轉換之前擁有相同的x，y位置，但如果原始x，y位置難以實現，我不會介意有一個固定點。

來源

2013-02-17 Nicholas Kyriakides

我在回答我自己的問題。

當我們使用變換調整SVG元素的大小時，元素相對於我們所做的變換在x，y軸上移動。

爲了抵消這種影響，我們只需要具有相同的'轉型'的參數雖然負（它移動到比轉型做什麼相反的方向在元件上施加負翻譯。

這我們抵消了轉換的定位效果，我們只獲得調整大小的效果。

來源

2013-06-09 08:04:10

在svg-canvas中定位轉換後的SVG元素

回答

相關問題