SVG

Introduction

The SVG contrib is a library that allows you to create and manipulate SVG graphics, straight from your qooxdoo application. It lets you work with SVG in qooxdoo's familiar object-oriented approach.

Most of the library is quite low level, so you're working directly with the SVG's elements. There are also some higher level features designed to make life easier.

Prior knowledge

The library structure is heavily based on the W3C SVG 1.1 FULL standard. Before using it, you should have at least a basic understanding of the standard.

If you're new to SVG, the following resources are great for bringing you up to speed:

Learn SVG: The Web Graphics Standard (free pdf e-book)
W3 Schools SVG tutorial

Finding documentation

Documentation can be found in multiple places:

The manual

The manual explains the various features of the library and can be found here.

It's also a good idea to look at the available demo programs. You can see them in action in the contrib demobrowser, or generate them from source. The default demo shows how to include an SVG drawing into your application along with some basic shapes. The freedraw demo shows how to define and use the path element. It's recommended to have a look at the source code of both.

API documentation

The API documention is probably the most important source of information. You can browse it from the link above, or generate it from source. The API docs are quite extensive, and nearly every package, class or property links directly to the related page in the official W3C standard for quick reference. The latest version can be found here.

Including the contrib

For details on how to include the contrib in your project, please refer to the contrib usage section of the qooxdoo manual.

The technical stuff

Embedding method

There are various ways to display SVG graphics in a webpage, each having its own advantages and disadvantages:

Using an <object> tag.
Using an <embed> tag.
Using an <iframe> tag.
Including it inline in XHTML.

This library places SVG inline in XHTML. This gives full control over the SVG graphic and allows it to be manipulated from the outside. The downside is that it will only work in browsers that have native support for SVG. Therefore this library cannot be used with SVG viewer plugins, such as Adobe's SVG Viewer.

Browser support

This library is being developed primarily for Firefox and Chrome. However, it should work on any browser that has native support for SVG (including IE9, but not IE8). Note that browser implementations of the SVG standard can vary a bit between versions.

The current state of the Mozilla and WebKit support for SVG can be found here: