Rather than converting viewbox-style bounds coordinates into translate/scale property values, it's probably better to use the matrix property (which is also part of CSS transforms).

The math is trivial, and the transformation matrix is conceptually much more powerful. You can start out with just the 2D zoom effect shown here, and then add rotation and even 3D transformations later while still using just one matrix.