Short SVG Tutorial image/svg+xml I Herman, W3C, Head of Offices mailto:ivan@w3.org en W3C - World Wide Web Consortium ® ©1994-2004, W3C (MIT,ERCIM,Keio) Short SVG Tutorial Short SVG Tutorial 0. [Title Page] 1. Graphics on the Web 2. What do we need? 3. SVG 4. A Simple SVG Example 5. The “basics” are all there... 6. Duck examples 7. Grouping 8. Structuring SVG Files: Templates 9. Grouping/Templates are Used a Lot! 10. Rendering Model 11. Opacity, Blending 12. Opacity on Groups 13. Clipping 14. Text 15. International Text 16. SVG Attributes 17. Stroke Attributes 18. Area Attributes 19. Pattern Fill 20. Typical Use of Patterns 21. Image as a Pattern 22. So what is the big deal? 23. Font Selection 24. SVG Fonts 25. SVG Font Definition... 26. ... and What You Get 27. Han Character example 28. Filters 29. Filter Operations 30. Filter Details 31. Coding Filters in SVG 32. (Rough) overview of filters 33. Colour Matrix Manipulation 34. Linear Component Transfer 35. Picture Compositing 36. Convolution Matrix on Pixels 37. Lighting 38. Filter examples on W3C Logo 39. SVG Animation 40. SVG animation example 41. Aspects to describe 42. What is animated? 43. Path Deformation 44. Walking Man... 45. Animate Transformation 46. Animate Motion 47. How is animation performed? 48. Key Values and Times 49. Time Interpolation Modes 50. Key Splines 51. Bouncing cubes 52. When is animation performed? 53. Chaining animations 54. Control with Mouse Events 55. Cartography Example 56. Lights and images: animating filters 57. Animating Font Glyphs 58. Animate Clipping Path 59. The Power of Local Animations 60. SVG DOM 61. SVG DOM Objects and Methods 62. Interaction with the DOM Tree 63. Event List 64. Frame Based Animation 65. Same Effect with Animation Objects! 66. When Should Scripts Be Used? 67. RDF Visualizer Example 68. Binomial Distribution 69. Clock 70. Mine Sweeper Example 71. Animation with Mouse 72. Miscellaneous 73. Conditional Processing 74. Metadata 75. SVG Mobile Profiles 76. Mobile SVG Examples 77. SVG in Practice 78. SVG and HTML 79. Implementations: Players 80. Implementations: Authoring 81. Application Examples 82. SVG 1.2: the next step 83. Further Information 84. Further Information (cont.) I Herman, W3C, Head of Offices,; © 1994-2004, W3C (MIT,ERCIM,Keio) 0 (84)