SVG.js utilities

Like Snap.svg, SVG.js has a suite of utility functions to help you work with SVG. Some of them are really great. This example shows how many of them work. 

To kick off this example we create a loaded SVG.js variable, draw, and pass in 800, 600 for the height and width

Starting off immediately with some utilities, we call draw.viewbox() to get the viewBox of the SVG element. If you remember the visualization example done with Snap.svg, you'll recall that we had to navigate multiple properties to access the viewBox in Snap. There was no convenience method at all, just a property of the DOM Node that represented the SVG element.

Here we have a convenience method that returns it directly: 

Next we load up a variable, rect ...

Get Mastering SVG now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.