title: Positioning a transformed SVG element within an svg-canvas
body: <p>I have written a function that will resize an SVG path, or any shape. However when i use it the path does gets resized but unfortunatetly it also changes position within my svg-canvas.</p>
  
  <p>this is my function</p>
  
  <pre><code>    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();
      }
  </code></pre>
  
  <p>I only want the shapes to be positioned on the top corner of my canvas once they get transformed. Ideally i would want them to have the same x,y position they had before the transformation however i wouldnt mind to have a fixed point if the original x,y position is difficult to achieve.</p>