">
Download presentation
Presentation is loading. Please wait.
Published byHarmony Beaman Modified over 3 years ago
1
Lecture # 11 JavaScript Graphics
2
Scalable Vector Graphics (SVG) Scalable Vector Graphics (SVG), as the name implies, are - scalable (without pixelation): - composed of vectors: - can be created using HTML and javascript - can be read and displayed by Browsers A B C
3
Scalable Vector Graphics (SVG) Example: Red Circle with black outline
4
Scalable Vector Graphics (SVG) Example: Red Circle with black outline
5
Scalable Vector Graphics (SVG) Example: Red Circle with black outline
6
Scalable Vector Graphics (SVG) Example: Red Circle with black outline
7
Scalable Vector Graphics (SVG) Example: Red Circle with black outline
8
Scalable Vector Graphics (SVG) Example: Red Circle with black outline
9
Scalable Vector Graphics (SVG) Example: Red Circle with black outline
10
Scalable Vector Graphics (SVG) Example: Red Circle with black outline
11
Scalable Vector Graphics (SVG) Example: Red Circle with black outline
12
SVG and XML SVG: Defines graphics in XML format HTML: Designed to display data XML: Designed to transport and store data - the focus is on what data is – it is a data format - XML does not DO anything - XML tags are not predefined – you must define your own tags (or have them defined as in "http://www.w3.org/2000/svg" version="1.1" - XML is designed to be self-descriptive
13
Scalable Vector Graphics (SVG) Example 2:
14
Scalable Vector Graphics (SVG) Example 2:
15
Scalable Vector Graphics (SVG) Example 3:
16
Scalable Vector Graphics (SVG) Example 3:
17
Scalable Vector Graphics (SVG) Example 4:
18
Scalable Vector Graphics (SVG) Example 4:
19
Scalable Vector Graphics (SVG) Example 4:
20
Scalable Vector Graphics (SVG) Example 4:
21
Scalable Vector Graphics (SVG) Example 5: Creating a Canvas to draw on: The size of the canvas 600 400
22
Scalable Vector Graphics (SVG) Example 6: Text on a rectangle: The size of the canvas 600 400
23
Scalable Vector Graphics (SVG) Example 5: Rotating a shape: - apply a single attribute to a shape (or group of shapes)
24
Other shapes, operations See http://www.w3schools.com/svg/default.asphttp://www.w3schools.com/svg/default.asp
Similar presentations
© 2018 SlidePlayer.com Inc.
All rights reserved.
Ppt on right to information act india Ppt on royal bengal tiger Ppt on astronomy and astrophysics magazine Ppt on extinct birds and animals Ppt on ac plant Ppt on synthesis and degradation of purines and pyrimidines nucleotides Ppt on steps in planning Ppt on three sectors of indian economy Ppt on quality education Ppt on helen keller the story of my life