SVG Intellisense schema for Visual Studio 2010 and 2008

Scalable Vector Graphics (SVG) is W3C standard language for describing two-dimensional vector and mixed vector/raster graphics in XML. Firefox 3+, Opera 9+ and Safari 3+ support SVG rendering.

Visual Studio and Visual Web Developer come with XML editor that provides intellisense and validation provided you have appropriate XML schema. Although XML editor supports both DTD and XSD validation we decided to use XSD schema. W3C site provides only modularized DTD schema for SVG. For your convenience we converted modular DTD to a single XSD file using handy Dtd2Xs converter from Syntext and then manually edited it to fix a few minor issues.

In order to enable SVG intellisense in VS and VWD follow these steps:

• Add SVG.XSD schema to your project (typically located in Program Files\Microsoft\SVG*).
• Create a new XML file and save it with SVG extension, such as svg-test.svg.
• Add basic SVG content and try typing < inside the <svg> element. You should see intellisense for SVG elements like circle, rectangle

<?xml version="1.0" encoding="utf-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="500" height="500" version="1.1">
   <rect x="100" y="100" width="300" height="300" /> 
</svg>

• Add new HTML file (say, svg-test.htm) in the root folder and add

<object data="svg-test.svg" type="image/svg+xml" width="500" height="500" /> 

• Right-click on the svg-test.htm file in Solution Explorer and choose Browse With....
• Pick SVG-enabled browser (such as Firefox) and click OK.
• You should see black rectangle rendered.