Scalable Vector Graphics ( SVG ) is an XML-based vector image format for two-dimensional graphics with support for interactivity and animation. The SVG specification is an open standard developed by the World Wide Web Consortium (W3C) since 1999.
The SVG image and its behavior are defined in an XML text file. This means that they can be searched, indexed, written, and compressed. As an XML file, SVG images can be created and edited with any text editor, as well as with image software.
All major modern web browsers - including Mozilla Firefox, Internet Explorer, Google Chrome, Opera, Safari, and Microsoft Edge - have SVG rendering support.
Video Scalable Vector Graphics
Overview
SVG has been developed in the World Wide Web Consortium (W3C) since 1999, after six proposals competing for vector graphics languages ​​were submitted to the consortium during 1998. The early SVG Working Group decided not to develop any commercial submissions but to create a markup language new ones informed by but not really based on any of them.
SVG allows three types of graphic objects: vector graphic forms such as paths and lines consisting of straight lines and curves, bitmap images, and text. Graphical objects can be grouped, organized, modified, and compiled into previously rendered objects. The feature set includes stacked transformations, clipping paths, alpha masks, filter effects, and template objects. SVG images can be interactive and may include animations, defined in SVG XML elements or through scripting accessing the Document Object Model SVG (DOM). SVG uses CSS for styling and JavaScript for scripting. Texts, including internationalization and localization, appear in plain text in SVG DOM improving the accessibility of SVG charts.
The SVG specification has been updated to version 1.1 in 2011. There are two 'SVG Mobile Profiles,' SVG Tiny and SVG Basic, meant for mobile devices with lower computing and display capabilities. Scalable Vector Graphics 2 became a W3C Candidate Recommendation on September 15, 2016. SVG 2 incorporates several new features apart from SVG 1.1 and SVG Tiny 1.2.
Although the SVG Specification primarily focuses on the vector graphics markup language, its design includes the basic capabilities of a page description language such as Adobe PDF. It contains provisions for rich graphics, and is compatible with CSS for styling purposes. SVG has the information necessary to place each glyph and image in the selected location on the printed page.
Scripting and animation
SVG images can be dynamic and interactive. Time-based modifications to elements can be described in SMIL, or can be programmed in a scripting language (eg ECMAScript or JavaScript). W3C explicitly recommends SMIL as the standard for animation in SVG.
A rich set of events like onmouseover and onclick can be assigned to an SVG graphical object.
Compression
SVG images, being XML, contain many repeated text fragments, making it suitable for lossless data compression algorithms. When SVG images have been compressed with industry standard gzip algorithms, this is referred to as the "SVGZ" image and uses the corresponding file name extension .svgz . Customizing SVG 1.1 viewers will display the compressed image. SVGZ files are typically 20 to 50 percent of their original size. W3C provides SVGZ files to test suitability.
Maps Scalable Vector Graphics
Development history
SVG was developed by the W3C SVG Working Group starting in 1998, after six competing vector graphics submissions were received that year:
- Web Scheme, from CCLRC
- PGML, from Adobe, IBM, Netscape, and Sun
- VML, by Autodesk, Hewlett-Packard, Macromedia, and Microsoft
- Hyper Graphics Markup Language, by Orange, PCSL, and PRP
- WebCGM, from Boeing, CCLRC, Inso, JISC, and Xerox
- DrawML, from Excosoft
The working group is chaired by Chris Lilley of the W3C.
Version 1.x
- SVG 1.0 to W3C Recommendation on September 4, 2001.
- SVG 1.1 became a W3C Recommendation on 14 January 2003. The SVG 1.1 specification is modulated to allow subsets defined as profiles. Apart from this, there is little difference between SVG 1.1 and SVG 1.0.
- SVG Tiny and SVG Basic became W3C Recommendations on January 14, 2003. These are described as SVG 1.1 profiles.
- SVG Tiny 1.2 became W3C Recommendation on December 22, 2008. It was originally conceived as a profile of the 1.2 Full SVG plan (which has since fallen in favor of SVG 2), but is then reactor as a stand-alone specification.
- SVG 1.1 Second Edition, which includes all errata and clarifications, but no new features for the original SVG 1.1 was released on August 16, 2011.
Version 2.x
- SVG 2 will fully process the 1.2 draft, with more integration with new web features like Cascading Style Sheets, HTML5, and Web Open Font Format.
Mobile profile
Due to industry demand, two mobile profiles were introduced with SVG 1.1: SVG Tiny (SVGT) and SVG Basic (SVGB).
This is a subset of the full SVG standard, primarily intended for user-agents with limited capabilities. Specifically, SVG Tiny is set for very limited mobile devices such as mobile phones; it does not support styling or scripting. SVG Basic is defined for higher level mobile devices, such as smartphones.
In 2003, 3GPP, an international telecommunications standards group, adopted Siny Tiny as a mandatory vector graphics media format for next generation telephones. SVGT is the required vector graph format and support from SVGB is optional for Multimedia Messaging Service (MMS) and Packet-switched Redirection Service. It is then added as the required format for vector graphics in 3GPP IP Multimedia Subsystem (IMS).
Differences from non-mobile SVG
None of the mobile profiles include support for the full Document Object Model (DOM), while only SVG Basic has optional support for scripting, but as both are fully compatible parts of the full standard, most SVG graphics can still be rendered by devices only supports mobile profiles.
SVGT 1.2 adds microDOM (DOM), styling and scripting.
Related jobs
MPEG-4 Part 20 standard - Light Application Scene Representation (LASeR) and Simple Aggregation Format (SAF) is based on SVG Tiny. It is developed by MPEG (ISO/IEC JTC1/SC29/WG11) and published as ISO/IEC 14496-20: 2006. SVG capabilities are enhanced in MPEG-4 Part 20 with key features for mobile services, such as dynamic updates, binary encoding, representation state-of-art font. SVG is also housed in MPEG-4 Part 11, in Extensible MPEG-4 Textual (XMT) format - textual representation of MPEG-4 multimedia content using XML.
Function
The SVG document can define components including shapes, gradients, etc., and use them repeatedly. SVG images can also contain raster graphics, such as PNG and JPEG images, and further SVG images.
Example
This code will return the form shown in the image (not including the grid):
SVG on the web
The use of SVG on the web is limited by a lack of support in older versions of Internet Explorer (IE). Many websites that present SVG images, such as Wikipedia, also provide images in raster format, either automatically via HTTP content negotiations or by allowing users to directly select files.
Google announced on August 31, 2010 that they have started indexing SVG content on the web, whether it's in a standalone file or embedded in HTML, and that users will start seeing such content listed among their search results. It was announced on December 8, 2010 that Google Image Search will also begin indexing SVG files. The site announces an option to restrict image search to SVG files on February 11, 2011.
Native browser support
Konqueror was the first browser to support SVG in version 3.2 release in February 2004. In 2011, all major desktop browsers, and many small ones, had multiple levels of SVG support. Other browser implementations are not yet complete; see the machine layout comparison for more details.
Some previous versions of Firefox (eg versions 1.5 and 3.6), as well as a handful of other out-of-date web browsers capable of displaying SVG graphics, require them embedded in & lt; object & gt; or & lt; iframe & gt; element to display it integrated as part of an HTML web page instead of using standard way to integrate images with & lt; img & gt; . However, SVG images can be inserted in XHTML pages using XML namespace.
Tim Berners-Lee, the inventor of the World Wide Web, has been critical of (previous versions) of Internet Explorer for failing to support SVG.
- Opera (since 8.0) has support for SVG 1.1 Tiny specifications while Opera 9 includes Basic SVG 1.1 support and part of SVG 1.1 Complete. Opera 9.5 has Tiny 1.2 SVG support. It also supports SVGZ (SVG compression).
- Browsers based on the Gecko layout engine (such as Firefox, Flock, Camino, and SeaMonkey) all have incomplete support for the SVG 1.1 Full specification since 2005. The Mozilla site has an overview of supported modules in Firefox and in-depth modules development. Gecko 1.9, included in Firefox 3.0, adds support for more SVG specifications (including filters).
- Pale Moon, who uses the Goanna layout engine (fork of Gecko machine), supports SVG.
- WebKit-based browsers (such as Apple's Safari, Google Chrome, and OmniWeb OmniWeb) have incomplete support for the SVG 1.1 Complete specification since 2006.
- Amaya has partial support of SVG.
- Internet Explorer 8 and later versions do not support SVG. IE9 (released March 14, 2011) supports the basic SVG feature set. IE10 extends SVG support by adding SVG 1.1 filters.
- Microsoft Edge supports many SVG 1.1.
- The Maxthon Cloud browser also supports SVG.
There are several advantages to original and full support: plugins are not required, SVG can be mixed freely with other content in one document, and rendering and scripting becomes much more reliable.
Browser support plug-in
Internet Explorer, up to and including IE8, is the only major browser that does not provide native SVG support. IE8 and older require plug-ins to render SVG content. There are a number of plug-ins available to help, including:
- GUI Framework The Many Open-Source JavaScript JavaScript provides partial support for SVG 1.1, SMIL, DOM and scripting styles in Internet Explorer (5.5 - 8.0) as well. It does not depend on any plugins and relies on the presence of an alternative VML Graphical Vector format in Internet Explorer.
- Batik, widely used Java plugin
- Google Chrome Frame from Google can support all web elements supported by WebKit, including SVG 1.0 and some SVG 1.1. ( terminated )
- GPAC, targeting SVGT 1.2
- Adobe SVG Viewer from the Adobe Systems plugin supports most SVG 1.0/1.1. ( terminated )
- Corel SVG Viewer ( terminated )
- RaphaÃÆ'ÂÂ Â «l is another JavaScript library that utilizes the intersection between VML and SVG features to create vector graphs and animate them.
- Renews Player for Internet Explorer from examotion GmbH, supports SVG 1.1 on IE 6 and 7 ( terminated )
- SVG Web is a JavaScript library for Web developers, targeted at Internet Explorer and depending on where Adobe Flash plugins are installed on client machines. SVG Web provides partial support for SVG 1.1, SVG Animation (SMIL), Fonts, Video and Audio, DOM and style scripts.
On January 5, 2010, a senior manager of the Internet Explorer team at Microsoft announced on its official blog that Microsoft had just asked to join the W3C's SVG Working Group to "take part in ensuring future versions of SVG specifications will be met, developers and end users needs," though no plans for SVG support in Internet Explorer were mentioned at the time. Internet Explorer 9 beta supports basic SVG features defined based on SVG 1.1 W3C recommendations. Functionality has been implemented for most SVG document structures, interactivity through scripting and inline styling and through CSS. DOM presentation elements, attributes and interfaces that have been applied include basic shapes, colors, fills, gradients, patterns, paths, and text.
Mobile support
SVG Tiny (SVGT) 1.1 and 1.2 are mobile profiles for SVG. SVGT 1.2 includes some features not found in SVG 1.1, including non-scaling strokes, supported by some SVG 1.1 implementations, such as Opera, Firefox and WebKit. Because the shared code base between desktop and mobile browsers is increasing, the use of SVG 1.1 over SVGT 1.2 is also increasing.
Support for SVG may be limited to SVGT on older or more limited smartphones, or may be particularly limited by their respective operating systems. Adobe Flash Lite supports SVG Tiny optionally since version 1.1. At the SVG Open 2005 conference, Sun demonstrated the SVG Tiny 1.1 mobile implementation for the Connected Limited Device Configuration (CLDC) platform.
Mobile phones that use Opera Mobile, as well as iPhone built in browsers, also include SVG support. However, while using the WebKit engine, the default Android browser does not support SVG before v3.0 (Honeycomb). Before v3.0, Firefox Mobile 4.0b2 (beta) for Android was the first browser running under Android to support SVG by default.
The available Tiny SVG support levels vary from mobile to mobile, depending on the installed SVG engine. Many newer mobile products support additional features beyond SVG Tiny 1.1, such as gradients and opacities; this is sometimes referred to as "SVGT 1.1", although there is no such standard.
Rim's BlackBerry has built-in support for SVG Tiny 1.1 since version 5.0. Continuous support for WebKit BlackBerry Torch browser on OS 6 and 7.
The Nokia S60 platform has built-in support for SVG. For example, icons are generally rendered using the SVG platform engine. Nokia also leads JSR 226: Scalable 2D Vector Graphics API expertise group that defines the Java ME API for SVG presentation and manipulation. This API has been implemented in S60 Platform 3rd Edition Feature Pack 1 and so on. Some Series 40 phones also support SVG (like Nokia 6280).
Most Sony Ericsson phones starting with K700 (based on release date) support SVG Tiny 1.1. Phones starting with the K750 also support features like opacity and gradient. The phone with Sony Ericsson Java Platform-8 has support for JSR 226.
Windows Phone has supported SVG since version 7.5
SVG is also supported on various mobile devices from Motorola, Samsung, LG, and Siemens mobile/BenQ-Siemens. eSVG, the SVG rendering library that is primarily written for embedded devices, is available on multiple mobile platforms.
Online SVG Converter
This is a list of incomplete web apps that can convert SVG files to raster image formats (this process is known as rasterization), or raster images to SVG (this process is known as image search or vectorization) - without the need to install a software desktop or plug- in browser.
- Autotracer.org. Vectorizer raster images online using AutoTrace library. BMP, GIF, JPEG, or PNG to DXF, EPS, PDF, or SVG. Upload limit: 1 MB.
- FileFormat.info - Change SVG to PNG, JPEG, TIFF. The output resolution can be determined. No batch processing. Upload limit: 5 MB.
- Online Conversions - Converts to/from BMP, EPS, GIF, HDR, ICO, JPEG, PNG, SVG, TGA, TIFF, WBMP, WebP. No batch processing. Output (eg image size) can be customized; the conversion to SVG is handled by Potrace.
- SVGConv - Convert SVG to JPEG, PNG, GIF, BMP, TGA, TIFF, PDF, PS, EPS. Allows users to customize output (such as image size, background color) and has a batch processing feature (converting many files in one step). Upload limit: 10 MB
- SVG2Android - Turn SVG into Android VectorDrawable (introduced in API 21)
- Free Online Converter - Converts most raster to SVG via search. When converting from a raster image such as PNG to SVG or JPG to SVG, the converter converts the form and object in a black-and-white image in the form of a vector graph. Conversion to SVG is handled by Potrace.
- iLoveIMG - Convert single or double SVG to online JPG.
App support
SVG images can be produced using vector graphics editors, such as Inkscape, Adobe Illustrator, Adobe Flash Professional, or CorelDRAW, and are assigned to common raster image formats such as PNG using the same software. Inkscape uses potrace (built-in) to import raster image formats.
The software can be programmed to render SVG images by using librsvg libraries used by GNOME since 2000, or Batik. SVG images can also be rendered to the desired popular image format by using ImageMagick, a free command line utility (which also uses librsvg under the hood).
Other uses for SVG include embedding for use in word processing (eg LibreOffice) and desktop publishing (eg Scribus), plotting charts (eg gnuplot), and importing paths (eg for use in GIMP or Blender). Microsoft Office 2016 adds support for importing and editing SVG images in January 2017. The Uniform Type identifier for SVG used by Apple is public.svg-image and in accordance with public.image and public.xml .
DOCTYPE
DOCTYPE for SVG 1.0 is:
and for SVG 1.1 is
but for various reasons, DOCTYPE should not be included in an SVG file.
See also
- Canvas element
- Comparison of graph file format
- Comparison of raster-to-vector conversion software
- Comparison of vector graphics editor
- Computer graphics
- Computer Metafile Chart
- Image file format
- Independence resolution
- SVG files in MediaWiki on Commons: Help: SVG
References
External links
- SVG W3C Specifications , implementation list
- primary W3C SVG W3C Primer (draft) under SVG Interest Group
- Scalable Vector Graphics in Curlie (based on DMOZ)
Source of the article : Wikipedia
0 Comments