CHAPTER 3  WORKING WITH SCALABLE VECTOR GRAPHICS

Figure 3-13. Modifying the stroke of a text element in Inkscape

Summary

In this chapter, you have seen how SVG in HTML5 provides a powerful way to create applications with interactive two dimensional graphics.

First we looked at a scene drawn using SVG embedded in an HTML5 document. We examined the elements and attributes that made up the drawing. We saw how you can define and reuse content definitions, group and transform elements, and draw with shapes, paths, and text.

Finally, we added JavaScript to an SVG document to make an interactive application. We used CSS, DOM manipulation, and events to take advantage of SVG’s nature as a live document.

Now that we’ve seen how SVG brings vector graphics to HTML5, we’ll turn our attention to audiovisual elements that bring more complex media to your application.

81