Introduction to SVG and Canvas¶
SVG Labs¶
- Getting Started
- HTML Template for testing SVG
- Basic shapes
- SVG Circle
- SVG Line
- SVG Rectangle
- SVG Ellipse
- SVG Polygon - used to create hexagons, octagons and stars
- SVG Polyline
- SVG Paths
- SVG Text
- SVG Text Effects
- SVG Gradients
- SVG Gallery of Fun Example
https://www.w3schools.com/graphics/svg_intro.asp
Canvas¶
Canvas is the HTML element that holds a drawing region on a web page using JavaScript. We can use a canvas program to do animations, write games. Before you dive into these labs you will need to know both some SVG and JavaScript to modify the demos.