The Journal of Online Mathematics and Its Applications

Volume 7. February 2007. Article ID 1381

Scalable Vector Graphics

David Lane

Department of Mathematics

The University of Virginia's College at Wise

Abstract

Scalable Vector Graphics (SVG) is the open source Worldwide Web Consortium (W3C) recommendation for two dimensional vector graphics. The combination of SVG and JavaScript is a powerful platform for creating interactive graphics, comparable to Flash and Java. SVG has been overlooked, however, partly because of incomplete browser support. This situation improved significantly in 2006 with the release in of Firefox 1.5 and Opera 9, both with native SVG capability. The first part of this article reviews the current status of SVG implementation and offers several examples with a mathematical flavor. The second part, for developers, explains one of the examples in detail.

Keywords

Technologies

The SVG's all open in a separate window, so a reader with a non SVG capable browser can still read the article (but won't be able to view the examples). The examples are best viewed in Firefox 1.5+, Opera 9 or Internet Explorer with the Adobe SVG plugin (see the Appendix on browser support). You must also have JavaScript enabled.

Contents

Main Contents

  1. A Mathematical Gallery of SVG
    1. Introduction
    2. The Gallery
  2. SVG: The Nuts and Bolts
    1. XML Basics
    2. Adding SVG Elements
    3. Drag and Drop with SVG

Appendices