Next is HTML5 Canvas.Animating SVG
There is no better way to wrap up our section on SVG by seeing how we can animate the art we created so far. By the end of this lesson you will know how to work with the animate and animateTransform nodes of SVG.
Keynotes:
- Creating an animation in SVG.
- Transforming animations with AnimateTransform.
- Wrapping up the section.
Ready to Level Up Your Skills?
Join thousands of learners on 02GEEK and start your journey to becoming a coding expert today!
Enroll Now for Free!Creating a basic SVG image
In this lesson we will learn how to define and create an SVG element.
08:22
Drawing a circle in SVG
In the last lesson we created an SVG image and filled it up with a red rectangle. In this lesson we will learn how to add more elements into our stage starting with a circle.
06:01
Integrating SVG into HTML5
In this lesson we will learn about the process, see the relationship between styling and rules and position our SVG exactly where we want it to be.
04:58
Creating a polygon
Up until now all the shapes we created in SVG where pre-made shapes. In this lecture we will learn how to create a polygon by defining as many points as we want into it.
06:26
Animating SVG
By the end of this lesson you will know how to work with the animate and animateTransform nodes of SVG.
05:36