- Scalable Vector Graphics
Infobox file format
name = Scalable Vector Graphics
extension = .svg, .svgz
mime = image/svg+xml [ [http://www.w3.org/TR/SVGMobile12/mimereg.html M Media Type registration for image/svg+xml] ]
type code =
uniform type =
World Wide Web Consortium
released = initial release|2001|09|04
latest release version = 1.2T
latest release date =
August 10, 2006
genre = vector image format
container for =
contained by =
extended from =
extended to =
url = [http://www.w3.org/Graphics/SVG/ w3.org/Graphics/SVG/]
Scalable Vector Graphics (SVG) is an
XMLspecification and file formatfor describing two-dimensional vector graphics, both static and animated.
The SVG specification is an
open standardthat 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 Explorersupport 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 is provided by Adobe Systems. Adobe intends to discontinue development and support for this product at the beginning of 2009, although it will still be available for download. In order to reap the benefits of the SVG standard, but still support IE users, some web sites use programs like RSVG 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.
SVG has been in development since 1999 by a group of companies within the
W3Cafter 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(see" Outline" image, at right)
Raster graphics(see" Bitmap" image, at right)
Graphical objects can be grouped, styled, transformed, and composited into previously rendered objects. SVG does not directly support z-indices [ [http://www.w3.org/TR/2002/WD-SVG12-20021115/#drawingorder SVG(W3C) § 4.2-Drawing Order] ] 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 namespacesuitable to the application, which enhances searchability and accessibilityof the SVG graphics. The feature set includes nested transformations, clipping paths, alpha masks, filter effects, template objects and extensibility.
The majority of search engines until recently did not index title or text content in svg files. It is not immediately apparent why indexing remains limited.
* http://www.openicon.org provides both a text and graphical means to search for svg icons. The openicon search engine is in development.
* http://www.openclipart.org maintains the original text only search engine, it displays thumbnails for some results.
While being primarily designated as a
vector graphics markup language, the specification is also designed with the basic capabilities of a page description language, like Adobe's PDF. It contains provisions for rich graphics, and is also compatible with the CSS specification's properties for styling purposes; thus, unlike XHTMLand XSL-FOwhich are layout-oriented languages, SVG is a fully presentational language. [ [http://www.svgopen.org/2002/papers/danilo_fujisawa__svg_as_page_description_language/index.html "SVG as a Page Description Language"] , presentation given at SVG.Open 2002, Zurich, Switzerland] A much more print-specialized subset of SVG ( SVG Print, authored by Canon, HP, Adobe and Corel) is currently a W3C Working Draft. [ [http://www.w3.org/TR/SVGPrint/ SVG Print 1.2] Working Draft]
cripting and animation
SVG drawings can be dynamic and interactive. Time-based modifications to the elements can be described in SMIL, or can be programmed in a
scriptinglanguage (e.g., ECMAScript). The W3C explicitly recommends SMIL as the standard for animation in SVG, [Paul Festa (2003-01-09), [http://news.com.com/2100-1023-979976.html "W3C releases scripting standard, caveat"] , CNET.com] however it is more common to find SVG animated with ECMAScript because it is a language that many developers already understand, and it is more compatible with existing renderers. A rich set of event handlers such as "onmouseover" and "onclick" can be assigned to any SVG graphical object.
SVG images, being XML, contain many repeated fragments of text and are thus particularly suited to compression by
gzip, though other compression methods may be used effectively. Once an SVG image has been compressed by gzipit may be referred to as an "SVGZ" image; with the corresponding filename extension. The resulting file may be as small as 20% of the original size. [ [http://www.adobe.com/svg/illustrator/compressedsvg.html Saving compressed SVG (SVGZ)] ]
SVG was developed by the W3C
SVG Working Groupstarting in 1998, after Macromediaand Microsoftintroduced Vector Markup Language(VML) whereas Adobe Systemsand Sun Microsystemssubmitted a competing format known as PGML. The working group was chaired by Chris Lilley of the W3C.
* SVG 1.0 became a W3C Recommendation on
September 4, 2001. [ W3C Recommendation, " [http://www.w3.org/TR/SVG10/ SVG 1.0 Specification] " (2001-09-04)]
* SVG 1.1 became a W3C Recommendation on
January 14, 2003. [W3C Recommendation, " [http://www.w3.org/TR/SVG11/ SVG 1.1 Specification] " (2003-01-14)] The SVG 1.1 specification is modularized in order to allow subsets to be defined as profiles. Apart from this, there is very little difference between SVG 1.1 and SVG 1.0.
SVG Tinyand SVG Basic(the Mobile SVG Profiles) became W3C Recommendations on January 14, 2003. These are described as profiles of SVG 1.1.
* SVG Tiny 1.2 became a W3C Candidate Recommendation on
August 10, 2006. [W3C Candidate Recommendation, " [http://www.w3.org/TR/2006/CR-SVGMobile12-20060810/ SVG Tiny 1.2 Specification] " (2006-08-10)] [ [http://lists.w3.org/Archives/Public/www-svg/2006Aug/0036.html SVG Tiny 1.2 is now a Candidate Recommendation] ] SVG Full 1.2 is a W3C Working Draft. SVG Tiny 1.2 was initially released as a profile, and later refactored to be a complete specification, including all needed parts of SVG 1.1 and SVG 1.2. SVG 1.2 Full adds modules onto the SVGT1.2 core.
* SVG Print adds syntax for multipage documents and mandatory color management support.
Because of industry demand, two mobile profiles were introduced with SVG 1.1: "SVG Tiny" (SVGT) and "SVG Basic" (SVGB). These are subsets of the full SVG standard, mainly intended for
user agents with limited capabilities. In particular, SVG Tiny was defined for highly restricted mobile devices such as cellphones, and SVG Basic was defined for higher-level mobile devices, such as PDAs.
In 2003, the
3GPPadopted SVG Tiny as the required graphics format for next-generation phones and Multimedia Messaging Services (MMS).
Neither mobile profile includes support for the full DOM, while only SVG Basic has optional support for scripting, but because they are fully compatible subsets of the full standard most SVG graphics can still be rendered by devices which only support the mobile profiles. [ [http://svg.org/special/svg_phones Listing of phones that support SVG] ]
SVGT 1.2 adds a microdom (μDOM), allowing all mobile needs to be met with a single profile.
SVG is an application of
XML. An SVG file is therefore a simple text file, which can be viewed and edited as can any other markup.
The SVG 1.1 specification defines 14 important functional areas [http://www.w3.org/TR/SVG11/index.html#minitoc "Scalable Vector Graphics (SVG) 1.1 Specification," 14 Jan. 2003] ] or feature sets:
;Paths:Simple or compound shape outlines drawn with curved or straight lines can be filled in or outlined (or used as a
clipping path) and are expressed in a highly compact coding in which, for example, M precedes the initial numeric X and Y coordinates and L will precede a subsequent point to which a line should be drawn. [http://www.w3.org/TR/SVG11/paths.html SVG specification, "Paths"] ]
;Basic Shapes:Straight-line paths or paths made up of a series of connected straight-line segments (polylines), as well as closed polygons, circles and ellipses can be drawn. Rectangles and round-cornered "rectangles" are other standard elements. [http://www.w3.org/TR/SVG11/shapes.html SVG specification, "Basic Shapes"] ]
;Text:Unicode character text included in an SVG file is expressed as
XMLcharacter data. Many visual effects are possible, and the SVG specification automatically handles bidirectional text (as when composing a combination of English and Arabic text, for example), vertical text (as Chinese was historically written) and characters along a curved path (such as the text around the edges of the Great Seal of the United States). [http://www.w3.org/TR/SVG11/text.html SVG specification, "Text"] ]
;Painting:SVG shapes can be filled and/or outlined (painted with a color, a gradient or a pattern). Fills can be opaque or have various degrees of transparency. "Markers" are end-of-line features, such as arrowheads, or symbols which can appear at the vertices of a polygon. [http://www.w3.org/TR/SVG11/painting.html SVG specification, "Painting: Filling, Stroking and Marker Symbols"] ] ;Color:Colors can be applied to all visible SVG elements, either directly or via the 'fill', 'stroke' and other properties. Colors are specified in the same way as in CSS2, i.e. using names like
#22ff00, in decimal like
rgb(255,255,127)or as percentages of the form
rgb(100%,100%,50%). [http://www.w3.org/TR/SVG11/color.html SVG specification, "Color"] ]
;Gradients and Patterns:SVG shapes can be filled or outlined with solid colors as above, or with color gradients or with repeating patterns. Color gradients can be linear or radial (circular), and can involve any number of colors as well as repeats. Opacity gradients can also be specified. Patterns are based on predefined raster or vector graphic objects, which can be repeated in x and/or y directions. Gradients and patterns can be animated and scripted. [http://www.w3.org/TR/SVG11/pservers.html SVG specification, "Gradients and Patterns"] ]
;Clipping, Masking and Compositing:Graphic elements, including text, paths, basic shapes and combinations of these, can be used as outlines to define both 'inside' and 'outside' regions that can be painted (with colors, gradients and patterns) independently. Fully opaque "clipping paths" and semi-transparent "masks" are "composited" together to calculate the color and opacity of every pixel of the final image, using simple alpha blending. [http://www.w3.org/TR/SVG11/masking.html SVG specification, "Clipping, Masking and Compositing"] ]
;Filter Effects [http://www.w3.org/TR/SVG11/filters.html SVG specification, "Filter Effects"] ]
;Interactivity [http://www.w3.org/TR/SVG11/interact.html SVG specification, "Interactivity"] ]
;Linking [http://www.w3.org/TR/SVG11/linking.html SVG specification, "Linking"] ]
;Scripting [http://www.w3.org/TR/SVG11/script.html SVG specification, "Scripting"] ]
;Animation [http://www.w3.org/TR/SVG11/animate.html SVG specification, "Animation"] ]
;Fonts [http://www.w3.org/TR/SVG11/fonts.html SVG specification, "Fonts"] ]
;Metadata [http://www.w3.org/TR/SVG11/metadata.html SVG specification, "Metadata"] ]
upport for SVG in web browsers
The use of SVG on the web is in its infancy; there is a great deal of inertia due to the long-time use of pure raster formats and other formats like
Adobe Flashor Java applets, and browser support for SVG is still uneven. Web sites which serve SVG images, for example Wikipedia, typically also provide the images in a raster format, either automatically by HTTP content negotiationor allowing the user to directly choose the file.
There are several advantages to native support: plugins would not need to be installed, SVG could be freely mixed with other formats in a single document, and rendering scripting between different document formats would be considerably more reliable. At this time all major browsers have committed to some level of SVG support except for Internet Explorer which will also not support SVG in the upcoming version IE8 [ [http://www.microsoft.com/windowsxp/expertzone/chats/transcripts/08_0619_ez_ie8.mspx Windows Internet Explorer 8 Expert Zone Chat (June 19, 2008) ] ] . Other browsers' implementations are lacking in consistency and completeness. See Comparison of layout engines for further details.
As of 2008, only Opera and Safari support embedding via the
*Opera (since 8.0) has support for the SVG 1.1 Tiny specification while Opera 9 includes SVG 1.1 Basic support and some of SVG 1.1 Full. Since 9.5 alpha 1 Opera has partial SVG Tiny 1.2 support.
*Browsers based on the Gecko layout engine (such as Firefox, Flock,
Netscape, Camino, SeaMonkeyand Epiphany), all have incomplete support for the SVG 1.1 Full specification since 2005. The Mozilla site has an overview of the modules which are supported in Firefox [ [http://developer.mozilla.org/en/docs/SVG_in_Firefox SVG in Firefox] ] and an overview of the modules which are in progress in the development [ [http://www.mozilla.org/projects/svg/status.html Mozilla SVG Status] ] . Gecko 1.9, included in Firefox 3.0, adds support for more of the SVG specification (including filters). [ [http://developer.mozilla.org/en/docs/SVG_improvements_in_Firefox_3 SVG improvements in Firefox 3] ]
*Browsers based on
WebKit(such as Apple's Safari, Google Chrome, and The Omni Group's OmniWeb) have incomplete support for the SVG 1.1 Full specification since 2006. [ [http://webkit.org/projects/svg/status.xml The official WebKit SVG status page] ] This includes Safari 3.0 and later (included with Mac OS X v10.5and Mac OS X v10.4.11) as well as Mobile Safari as of iPhone OS2.1.
*Amaya has partial SVG support.
As of October 2008, Windows Internet Explorer provides no native SVG support. IE requires a pluginto render SVG content. Adobeprovides SVG Viewer, the most widely used SVG plugin, but plans to discontinue support on January 1, 2009. SVG Viewer will remain available for download after this date [ [http://www.adobe.com/svg/viewer/install/mainframed.html Adobe SVG Viewer download area] ] [http://www.adobe.com/svg/eol.html Adobe SVG Viewer End of Life announcement] ] . The plugin supports most of SVG 1.0/1.1. Adobe SVG plugin support for pre-3.0 versions of Safari is for PowerPConly. User-reported issues include lack of a scrolling feature, to enable viewing of any area of the SVG lying outside the visible area of its containing window.
October 2008. Users report several issues: rendering problems upon dynamically resetting size properties of embedded SVG
The [http://blog.svg-map.com/2007/03/about_establish.html SVG Map Consortium] released an IE plugin on
September 6, 2007. Implementation of the full [http://www.w3.org/TR/SVG11 Scalable Vector Graphics (SVG) 1.1 Specification] in the plugin was not complete at that release date. [ [http://www.g-contents.jp/2007/3prog.htm#003 g-Contents WORLD 2007 ] ] [ [http://blog.svg-map.com/2007/09/svg_map_toolkit.html SVG Map ToolKit Download] ] KDE's KonquerorSVG plugin release is KSVG. KSVG2 was rolled into KDE 4 core, making it native-rendering. (SVG finds increasing use on the KDE platform: this system-wide support for SVG graphics in version 4 follows early support for SVG wallpaper at version version 3.4.)
Corel once offered an SVG Viewer plugin, but has ceased development.
upport in applications
Images are usually automatically rasterised using a library such as
ImageMagick, which provides a quick but incomplete implementation of SVG, or Batik, which implements nearly all of SVG 1.1 but requires the Java Runtime Environment.
Inkscapeis a free softwareSVG drawing program for Linux, Windows and Mac OS.
*The Batik SVG Toolkit can be used by Java programs to render, generate, and manipulate SVG graphics.
xfigallows import and export of SVG drawings.
GNOMEproject has had integrated SVG support throughout the desktop since 2000.
*Images drawn in
OpenOffice.org Drawcan be exported as SVG. Import filters are available [ [http://wiki.services.openoffice.org/wiki/SVG_Import_Filter OpenOffice.org SVG Import Filter] ] to import SVG images into OOo documents.
Adobe Illustratorsupports both the import and export of SVG images. Photoshop, however, does not support SVG import. When writing SVG files Illustrator embeds a complete copy of the image in a proprietary format for later reediting. This often results in changes being lost if another editor is used then the file is reopened in Illustrator.
CorelDRAWhas an SVG export and import filter.
Xara Xtremehas an SVG export and import filter in its free/open source Linux version.
Nexaweb RIA PlatformSupports SVG in its Java Client technology.
KoolMoveshas very weak SVG support.
Microsoft Visiocan save files in the SVG format as well as the SVG compressed format. Graphs created in Microsoft Excelor figures from Microsoft Wordcan be cut and pasted into Microsoft Visiodocuments.
The GIMPallows SVG images to be imported as paths or rendered bitmaps.
*Blender will import SVG graphics as paths.
* [http://www.ecrion.com/Products/XFRenderingServer/Overview.aspx XF Rendering Server] from [http://www.ecrion.com/ Ecrion Software] supports creation of PDF, POSTSCRIPT, AFP from SVG and XSL-FO.
pstoeditconverts PostScript files to SVG by means of plugin [ [http://www.helga-glunz.homepage.t-online.de/plugins/index.htm pstoedit plugins] ]
Also some programming languages and scientific plotting programs can be used to create SVG plots:
MATLABfigures can be exported to SVG with help of plot2svg function available on [http://www.mathworks.com/matlabcentral/fileexchange/loadFile.do?objectId=7401&objectType=file MATLAB File Exchange]
GNU Octavecan save plots with help of print function.
gnuplotcan save plots to SVG. See .
Export function supports SVG versions 1.0 and 1.1
* Cairo is a vector graphics based library which can generate SVG. It has bindings for many programming languages including Haskell, Java, Perl, Python, Scheme, Smalltalk and several others.
On mobile, the most popular implementations for mobile phones are by
Ikivoand Bitflash, while for PDAs, Bitflash and Intesishave implementations. Flash Lite by Adobe optionally supports SVG Tiny since version 1.1. At the SVG Open2005 conference, Sun demonstrated a mobile implementation of SVG Tiny 1.1 for the CLDC platform. Mobile SVG players from Ikivo and BitFlash come pre-installed, i.e., the manufacturers burn the SVG player code in their mobiles before shipping to the customers. Mobiles also can include full web browsers (such as Opera Miniand the iPhone's Safari) which include SVG support.
The level of SVG Tiny support available varies from mobile to mobile, depending on the manufacturer and version of the SVG engine installed. Many of the new mobiles support additional features beyond SVG Tiny 1.1, like gradient and opacity; this standard is often referred as SVGT 1.1+.
S60 platformhas built-in support for SVG. For example, icons are generally rendered using the platform's SVG engine. Nokia has also led the [http://www.jcp.org/en/jsr/detail?id=226 JSR 226: Scalable 2D Vector Graphics API] expert group which defines Java ME API for SVG presentation and manipulation. This API has been implemented in S60 Platform 3rd Edition Feature Pack 1 onward. [ [http://www.s60.com/business/productinfo/applicationsandtechnologies/java/supportedfeaturesin3rdedition S60 Product info] ] Some Series 40 phones also support SVG (such as 6280).
Sony Ericssonphones beginning with K700(by release date) support SVG Tiny 1.1. Phones beginning with K750also support such features as opacity and gradients. Phones with Java Platform-8 have support for JSR 226.
SVG is also supported by other models from
Motorola, Samsung, LG, and Siemens.
sXBLSVG's XML binding language
Raster to vector
List of vector graphics markup languages
List of vector graphics editors, editors, converters and other tools for SVG.
Comparison of layout engines (SVG)
Vector Markup Language
Geographic information system
Computer Graphics Metafile, a standard file format, defined by ISO/IEC 8632
SWF, a competing file format from Adobe
* , Wikipedia's help and information article on how SVG's are used within Wikipedia.
* , more help and information, from Wikimedia Commons' perspective.
* , links to a variety of SVG resources.
* [http://www.w3.org/Graphics/SVG/ W3C SVG page] specifications, list of implementations
* [http://svg.org/ SVG Community] news, wiki
* [http://svgopen.org SVG Open] , world conference
* [http://www.linuxrising.org/svg_test/index.html SVG Rendering engine Comparison pages] Comparisons of several FOSS SVG libraries, with screenshots
* [http://www.w3schools.com/svg/default.asp SVG Tutorial] from W3Schools
* [http://www.flash-creations.com/notes/sample_svgtoflash.php Using SVG Path Data in Flash] article
* [http://www.joshuazeidner.com/2008/02/ted-gould-svg-inkscape-and-web.html Ted Gould: SVG, Inkscape, and Web Standards]
* [http://vectormagic.com/ An online converter that converts raster images to vector graphics]
* [http://blog.tiagocardoso.eu/mainada/comics-sketch/2008/07/04/svg-viewer-demo/ Flash SVG viewer Demo]
* [http://code.google.com/p/rastertovector/ Open source application that generates SVG]
Wikimedia Foundation. 2010.
Look at other dictionaries:
Scalable vector graphics — « SVG » redirige ici. Pour les autres significations, voir SVG (homonymie). Scalable Vector Graphics Extension de fichier … Wikipédia en Français
Scalable Vector Graphics — (SVG) es un lenguaje para describir gráficos vectoriales bidimensionales, tanto estáticos como animados (estos últimos con ayuda de SMIL), en XML. SVG se convirtió en una Recomendación del W3C en Septiembre de 2001, por lo que ya ha sido incluido … Enciclopedia Universal
Scalable Vector Graphics — Scalable Vector Graphics, SVG … Universal-Lexikon
Scalable Vector Graphics — Vorlage:Infobox Dateiformat/Wartung/MagischeZahl fehltVorlage:Infobox Dateiformat/Wartung/Standard fehlt Scalable Vector Graphics Vorlage:Infobox Dateiformat/Wartung/Screenshot Format … Deutsch Wikipedia
Scalable Vector Graphics — « SVG » redirige ici. Pour les autres significations, voir SVG (homonymie). Scalable Vector Graphics … Wikipédia en Français
Scalable Vector Graphics — Масштабируемая векторная графика Расширение файла: .svg, .svgz Тип Разработчик: World Wide Web Consortium Расширение для: англ. Scalable Vector Graphics масштабируемая векторная графика; произносится [эс ви джи]) язык разметки масштабир … Википедия
Scalable Vector Graphics — Gráficos Vectoriales Escalables Desarrollador World Wide Web Consortium … Wikipedia Español
Comparison of layout engines (Scalable Vector Graphics) — Scalable Vector Graphics SXBL SVG Working Group SVG filter effects Precision Graphics Markup Language Vector Markup Language XHTML+MathML+SVG SVG animation Comparison of layout engines (SVG) … Wikipedia
Vector graphics — This article is about computer illustration. For other uses, see Vector graphics (disambiguation). Example showing effect of vector graphics versus raster graphics. The original vector based illustration is at the left. The upper right image… … Wikipedia
vector graphics — a method of electronically coding graphic images so that they are represented in lines rather than fixed bit maps, allowing an image, as on a computer display screen, to be rotated or proportionally scaled. * * * ▪ computer science… … Universalium