0

我编写了一个函数，可以调整 SVG 路径或任何形状的大小。但是，当我使用它时，路径确实会调整大小，但不幸的是它也会改变我的 svg-canvas 中的位置。

这是我的功能

    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 位置难以实现，我不介意有一个固定点。

4

1 回答 1

0

我正在回答我自己的问题。

当我们使用 transform 调整 SVG 元素的大小时，元素会相对于我们所做的转换在 x,y 轴上移动。

为了抵消这种影响，我们只需要对具有相同“转换”参数的元素应用负转换，尽管是负转换（它将其移动到与转换相反的方向。

通过这种方式，我们抵消了转换的定位效果，我们只得到了调整大小的效果。

于 2013-06-09T08:04:10.190 回答