Ok. I’ve been playing with the code of rack to add the servers to be drag and dropped. My idea is have a parent SVG with many childs. One for the “”paper””, one for the controls, one for the elements to be dragged.

But something strange happen when I add a SVG child that have a viewBox inside a Svg with a viewBox too. I have to part from a clear code in codepen http://codepen.io/manolopm/pen/Hzvfd to try understand the problem.

In the codepen, we can see the main SVG (canvas) with the childs (paper and controls). Canvas has a viewBox set to “0 0 2800 2715” (it could be any value I choose this for trying).

  • Control is an svg child in 100,10 coordinates. Also have a 200×200 box inside.
  • Paper is an svg child in 400,10 coordinates and the size is 200×200. Inside have a box of 50×50 but because It has a viewBox “0 0 50 50” seems the same size. The container size is 200×200 and the box of 50×50 its scaled to fill the 200×200 container.

Now that seems that I understand how it works I’ll try to change rack to adjust as It should.