Cyclone3 Skin

SVG

From Cyclone3 Wiki

Scalable Vector Graphics (SVG) is an XML specification and file format for describing two-dimensional vector graphics, both static and animated.

The SVG specification is an open standard that has been under development by the World Wide Web Consortium (W3C) since 1999. SVG images and their behaviours are defined in XML text files. This means that they are able to be searched, indexed, scripted and, if required, compressed.

Since 2001, SVG has progressed from version 1.0 to 1.2 and has been modularised to allow various profiles to be published, including SVG Print, SVG Basic and SVG Tiny.

All modern web browsers except Microsoft Internet Explorer support and render SVG markup directly. To view SVG files in Internet Explorer (IE), users have to download and install a plugin. The most common IE plugin was produced by Adobe. Adobe, however, is planning to withdraw this product at the beginning of 2009. In order to reap the benefits of the SVG standard, but still support IE users, some web sites use programs like librsvg automatically to provide 'rasterised' versions of their SVG graphics to IE browsers, while still delivering the full versions to all other visitors. Alternatives to the Adobe plugin are also available for IE users who are aware of the limitation and wish to view the original graphics.

SVG files can be edited with any text editor, but specialist SVG development environments are also available. These offer a wide range of specialised and general-purpose features.

Being an efficient, widely understood and flexible image format, SVG is also well-suited to small and mobile devices. The SVG Basic and SVG Tiny specifications were developed with just such uses in mind and many current mobile devices support them.

Contents

Overview

SVG has been in development since 1999 by a group of companies within the W3C after the competing standards PGML (developed from Adobe's PostScript) and VML (developed from Microsoft's RTF) were submitted to W3C in 1998. SVG drew on experience designing both those formats.

SVG allows three types of graphic objects:

  • Vector graphics
  • Raster graphics
  • Text

Graphical objects can be grouped, styled, transformed, and composited into previously rendered objects. SVG does not directly support z-indices that separate drawing order from document order for objects, which is a drawback with respect to other vector markup languages like VML. Text can be in any XML namespace suitable to the application, which enhances searchability and accessibility of the SVG graphics. The feature set includes nested transformations, clipping paths, alpha masks, filter effects, template objects and extensibility.

Example

<?xml version="1.0"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" 
  width="467" height="462">
 <rect x="80" y="60" width="250" height="250" rx="20" fill="red"
        stroke="black" stroke-width="2px" />
 <rect x="140" y="120" width="250" height="250" rx="40" fill="blue"
        stroke="black" stroke-width="2px" fill-opacity="0.7" />
</svg>

See Also

  • ...

External links