Gwoli ścisłości, SVG już dawno nadszedł, na tyle dawno, że Flash był jeszcze w powijakach. Ale co to właściwie SVG? Scalable Vector Graphics, czyli format oparty na XML-u służący do opisu danych wektorowych. Ok, ale po co mi to?

Obecnie wszystkie najpopularniejsze przeglądarki za wyjątkiem tej, której imienia nie warto wspominać wspierają SVG. Oznacza to, że możemy korzystać z jego dobrodziejstw praktycznie nieskrępowanie. Nie potrzeba żadnych wtyczek (IE jest wyjątkiem)! Nie bez przyczyny porównałem SVG do Flasha, ponieważ daje podobne możliwości. Brak tu jednak obsługi strumieni, wideo i audio.

Wstawienie gotowego pliku w formacie .svg, wykonanego przy pomocy programu do tworzenia grafiki wektorowej (np. open-source’owy Inkscape) jest banalne. Dlaczego więc z tego nie korzystać? Zobacz poniższy przykład:


<pre id="line1"><head>
    <meta name="svg.render.forceflash" content="true"></meta>
    <script src="<a href="view-source:http://codinginparadise.org/projects/svgweb/src/svg.js">../../src/svg.js</a>" data-path="../../src/"></script>
</head>
<body>

<pre id="line37">    <!--[if IE]>
    <object src="../svg/img.svg" classid="image/svg+xml"
            style="display: block;">
    <![endif]-->
    <!--[if !IE]>-->
    <object data="../svg/img.svg" type="image/svg+xml"
            style="display: block;">
    <!--<![endif]-->
    </object>
</pre>
</body>

Kod wraz z komentarzami warunkowymi dla zapewnienia poprawnego działania w IE. To wszystko.

Oczywiście można pokusić się o generowanie grafik on-line, w końcu SVG to format oparty na XML-u. Zobacz źródła przykładu projektu svgweb Google’a.

Więcej na temat formatu SVG.