Creating SVG

SVG is XML. In principle, it can be created by any text editor. Of course, having syntax checking for well-formedness and color highlighting is an improvement over an editor such as Windows Notepad.

Listing 15.1 shows a simple SVG document that animates some text from a position offscreen onto the screen shortly after the document loads.

Listing 15.1. HelloVector.svg: An Animated Greeting Expressed in SVG
<?xml version='1.0'?> 
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" 
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> 
<svg> 
<text x="-320" y="50" style="font-family:Arial; font-
  size:24;"> 
Hello Vector Graphics World! 
<animate attributeName="x" from="-320" to="20" 
  begin="1s" dur="3s" fill="freeze" /> 
</text> 
</svg> ...

Get Sams Teach Yourself XML in 10 Minutes now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial