Note that the centre co-ordinate is defined through cx and cy
r gives the radius

Note that the circle is on top, this is because it was drawn last.
To leave out an edge stroke don't put the stroke command in.
The line has start x1,y1 and end x2,y2 coordinates.

Extension:SVG

There are several vector graphic formats out there, but an easy one to get started with is Scalable Vector Graphics (SVGs). SVGs are very easy to create and are supported by all modern major web browsers. To create an SVG, you need to add the tags <svg xmlns="http://www.w3.org/2000/svg"> at the beginning and </svg> at the end. Copy the following into a text file and save it as image.svg

Once you have saved this, drag it into a browser window and you should see some shapes. SVGs are very powerful and you can attach code to their structure, making them interactive. If you want to learn more about how make SVGs take a look at w3schools

Exercise: Vector Graphics

What is a drawing list

Answer:

a set of commands used to define a vector image

Give some objects that can be used in vector graphics:

Answer:

Line

Text

Rectangle

Circle

Give the properties needed to display a rectangle:

Answer:

x,y

width, height

fill

stroke (colour), stroke-width

Give the properties needed to display a line:

Answer:

x1,y1 - start coordinates

x2,y2 - end coordinates

width

fill

stroke (colour)

Give the definition of a vector image:

Answer:

images defined using mathematics and geometry such as points, lines, curves, and shapes or polygon(s). Allowing for scalability