Since we started developing our PDF to SVG converter, I have been getting up to speed on the SVG file Format and investigating useful tools. SVG is becoming increasingly important format on the web and support is now very good. So I thought this would make an useful series of articles for others.
What is SVG?
Scalable Vector Graphics (SVG) is an XML-based vector image format (and very flexible in that images can be searched, indexed, scripted, and compressed) and an open standard developed since 1999 by the World Wide Web Consortium (W3C) and is supported by the major browsers such as Mozilla Firefox, Internet Explorer 9-10, Google Chrome, Safari and Opera.
SVG images allow three types of graphic objects: vector graphics, raster graphics, and text. Graphical objects, such as PNG and JPEG raster images are easily grouped modified, styled transformed and composed into different rendered objects and can have their behaviors easily modified using XML text files, therefore using text editiors is one way of creating SVG images.
Because of the support for this format and modern browsers supporting it natively there are a variety of useful tools both commercial and open-sourced, I tend to prefer open-sourced products because of the stronger community and support behind these products is useful.
Useful Free SVG tools
I recommend the following tools for interacting with SVG’s:
1. SharpVectorGraphics (aka SVG#)
SharpVectorGraphics (aka SVG#) is based on a Microsoft .Net open-source project toolkit design for applications that use the Scalable Vector Graphics on a .Net framework, and supports generation, manipulation and viewing and the project was designed to give a set of core modules which developers could build a foundation to support specific SVG solutions.
2. Cairo
Cairo is a 2D graphics library capable of stroking and filling cubic Bézier splines, transforming and compositing translucent images, and antialiased text rendering amd with drawing operations they can be transformed by any affine transformation (scale, rotation, shear, etc.)
There is also a multitude of support for output targets which include X Window System (Xlib and XCB), Win32, Quartz, image buffers, PostScript, PDF, and SVG file output, there is one pro to Cairo which is it produces a consistent output on all output media and takes advantage of hardware acceleration if it is available.
3. Graphviz
Graphviz is graph visualization software which supports SVG, PDF or Postscript for inclusion in other documents; or for displaying an interactive graph browser, additionally It is very good at representing structural information such as diagrams of abstract graphs and networks and has many useful features which include features for concrete diagrams, such as options for colors, fonts, tabular node layouts, line styles, hyperlinks, roll and custom shapes.
4. Inkscape
Inkscape is an open source vector graphics editor which fully supports the Scalable Vector Graphics (SVG) 1.1 standard and is supported on Mac OSX, Unix like OS and Microsoft Windows.
Objects in Inkscape are capable of affine transformations (moving, rotating, scaling, skewing and have a configurable matrix), objects can be grouped, cloned aswell and Inkscape supports text editing for both regular multi-line text (SVG’s <text> element) and flowed text (the non-standard <flowRoot> element, formerly proposed for SVG 1.2).
Inkscape’s is compatible with a multitude of formats, its native format is SVG, but also PS, EPS and PDF, AI (Adobe Illustrator) and most raster formats.
5. Apache Batik
Batik is a open source tool from the Apache Software Foundation.
The toolkit is written in Java and nearly has complete SVG 1.1 support, as well as some features that were incorporated that were originally planned for SVG 1.2.
Apart from a viewer and a rasterizer for PNG output, Batik has an SVG pretty printer to format SVG files and a TrueType-to-SVG-Font converter and can transform SVG to PDF.
Next time I will be looking at some commercial tools for SVG. In the meantime, do you have any favourite tools?
This post is part of our “SVG Article Index” in these articles, we aim to help you build knowledge and understand SVG.