際際滷

際際滷Share a Scribd company logo
Presented by C
Pradip Kumar Mudi
Scalable Vector Graphics(SVG)
3/25/20141
Introduction :
ScalableVector Graphics (SVG) is an XML-based vector
image format for two-dimensional graphics that has support
for interactivity and animation.The SVG specification is an
open standard developed by the WorldWideWeb
Consortium (W3C) since 1999. SVG allows three types of
graphic objects: vector graphics, raster graphics, and
text.
3/25/20142
About SVG :
3/25/20143
? Filename extension : .svg, .svgz
? Internet media type : image/svg+xml
? Type code : "svg ", "svgz"
? UniformType Identifier : public.svg-image
? UTI conforms to : public.image and public.xml
? Developed by : W3C
? Initial release : 4 September 2001; 12 years ago
? Latest release : 1.1 (Second Edition) / 16August 2011; 2 years ago
? Type of format : Vector image format
? Extended from : XML
Why use SVG?
? SVG is text-based
? Resolution Independent
? Reducing HTTP Request
? Styling and Scripting
? Can be animated and Edited
? Smaller File Size
? SVG is XML and works within other language
formats
? SVG is easily edited
3/25/20144
Advantages of SRG over SVG:
3/25/2014
?This image illustrates the difference between Raster(bitmap) and
Vector images.
?The Raster image is composed of a fixed set of dots, while the
vector image is composed of a fixed set of shapes.
?In the picture, scaling the bitmap reveals the dots while scaling the
vector image preserves the shapes.
5
SVG on the web :
3/25/20146
? Google announced on 31August 2010 that it had started to
index SVG content on the web, whether it is in standalone
files or embedded in HTML, and that users would begin to
see such content listed among their search results. It was
announced on 8 December 2010 that Google Image Search
would also begin indexing SVG files .On 28 January 2011, it
was discovered that Google was allowing Image Search
results to be restricted exclusively to SVG files.
SVG(1.1) supported browsers:
3/25/20147
? Flock
? Firefox
? Camino
? Konqueror
? SeaMonkey
? Apple's Safari
? Google Chrome
? The Omni Group's OmniWeb
? Internet Explorer 9,Amaya(partially supports SVG)
Example of an ellipse SVG image with code :
3/25/20148
Example of an ellipse SVG image with code
and within text :
3/25/20149
Example of a SVG image :
3/25/201410
3/25/201411

More Related Content

Scalable vector graphics(svg)

  • 1. Presented by C Pradip Kumar Mudi Scalable Vector Graphics(SVG) 3/25/20141
  • 2. Introduction : ScalableVector Graphics (SVG) is an XML-based vector image format for two-dimensional graphics that has support for interactivity and animation.The SVG specification is an open standard developed by the WorldWideWeb Consortium (W3C) since 1999. SVG allows three types of graphic objects: vector graphics, raster graphics, and text. 3/25/20142
  • 3. About SVG : 3/25/20143 ? Filename extension : .svg, .svgz ? Internet media type : image/svg+xml ? Type code : "svg ", "svgz" ? UniformType Identifier : public.svg-image ? UTI conforms to : public.image and public.xml ? Developed by : W3C ? Initial release : 4 September 2001; 12 years ago ? Latest release : 1.1 (Second Edition) / 16August 2011; 2 years ago ? Type of format : Vector image format ? Extended from : XML
  • 4. Why use SVG? ? SVG is text-based ? Resolution Independent ? Reducing HTTP Request ? Styling and Scripting ? Can be animated and Edited ? Smaller File Size ? SVG is XML and works within other language formats ? SVG is easily edited 3/25/20144
  • 5. Advantages of SRG over SVG: 3/25/2014 ?This image illustrates the difference between Raster(bitmap) and Vector images. ?The Raster image is composed of a fixed set of dots, while the vector image is composed of a fixed set of shapes. ?In the picture, scaling the bitmap reveals the dots while scaling the vector image preserves the shapes. 5
  • 6. SVG on the web : 3/25/20146 ? Google announced on 31August 2010 that it had started to index SVG content on the web, whether it is in standalone files or embedded in HTML, and that users would begin to see such content listed among their search results. It was announced on 8 December 2010 that Google Image Search would also begin indexing SVG files .On 28 January 2011, it was discovered that Google was allowing Image Search results to be restricted exclusively to SVG files.
  • 7. SVG(1.1) supported browsers: 3/25/20147 ? Flock ? Firefox ? Camino ? Konqueror ? SeaMonkey ? Apple's Safari ? Google Chrome ? The Omni Group's OmniWeb ? Internet Explorer 9,Amaya(partially supports SVG)
  • 8. Example of an ellipse SVG image with code : 3/25/20148
  • 9. Example of an ellipse SVG image with code and within text : 3/25/20149
  • 10. Example of a SVG image : 3/25/201410