Symbols in SVG
This chapter is from the book
This chapter is from the book
This chapter is from the book
Hour 8: Symbols
One of the most useful features in SVG is the ability to establish an object (or group of objects) as a symbolic group. By doing so, this "symbol" can be referenced multiple times throughout the document.
For example, say you were creating a bulleted list of ten items that would need to be updated for every season. For lack of a better example, say you wanted a pumpkin for your Halloween bullet. Rather than drawing one pumpkin and duplicating it nine times (creating a lot of additional code), you can create the bullet graphic once and store it within a reference library. Now your pumpkin exists abstractly and can be referenced with a small line of code ten times to create your list. Even better, when you decide to change the pumpkin to a pilgrim's hat for your Thanksgiving list, you simply change the symbol in your definition to reflect the new artwork. Voila! Instantly, you will now have ten pilgrim's hats instead of ten pumpkins.
By keeping your commonly used graphics in your SVG document separated from the remaining graphical content, you are able to make sweeping changes to the appearance of your file far more quickly than by any other means.
This hour will introduce you to the following of concepts:
-
What a symbol is
-
How to create a symbol
-
Referencing a symbol
-
Using symbols efficiently
When you are finished with this chapter, you will be able to use artwork you have created as reusable objects within your documents. You may find, in fact, that your artwork can be redrawn more efficiently by using symbols in place of unique objects.