SVG Essentials

Appendix F. Using SVG with Other XML Applications

John Donne said that no man is an island, and likewise SVG is not the only XML application in the universe. In fact, as an XML application, SVG is intended to be used with other XML applications. We’ll explore several such uses in this appendix.

Referring to an SVG Document in HTML

OK, so we lied. HTML isn’t an XML application, but you’ll still want to put SVG graphics in a web page. For most browsers, this is done by using a plug-in. As of this writing, Adobe’s SVG viewer plugin is available for Windows and Macintosh systems. To have a plug-in display in an SVG file within an HTML document, you use the <embed> element. The src attribute specifies the file in which the SVG resides, and the width and height attributes tell how much screen space to reserve for the graphic. The graphic will be centered in the space that you specify. You must also specify a type attribute with a value of image/svg+xml.

<embed src="some_file.svg" width="100" height="200"
    type="image/svg+xml" />

Additionally, you may specify a pluginspage attribute whose value is a URL where users may download the plug-in.

Referring to an SVG Document in XHTML

This is where things get interesting. First, the <embed> element is deprecated in HTML 4.0, and nonexistent in HTML 4.01 and XHTML. Obviously, this calls for other measures. In place of <embed>, you must use the <object> element. It also needs a height, width, and type, but it uses the data attribute to specify where ...