![Page 1: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/1.jpg)
FlowchartsGraphically representing the path of the program
![Page 2: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/2.jpg)
You’ve maybe seen some of the joke flowcharts.
![Page 3: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/3.jpg)
The Birthday Card that I got my sister.
![Page 4: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/4.jpg)
On the back:
![Page 5: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/5.jpg)
![Page 6: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/6.jpg)
That’s not what we are making.
![Page 7: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/7.jpg)
Flowcharts are part of the program
process.
![Page 8: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/8.jpg)
Flowcharts are also useful to help you
visualize the
flow of a program.
![Page 9: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/9.jpg)
YrsToVote = 18-Age
Start
Get Age
“Wait ” + YrsToVote
End
onEvent("button1", "click", function(event)
{
var Age = promptNum ("Enter your age: ");
var YrsToVote = 18 - Age;
setText("Answer", "Wait "+YrsToVote);
});
An example:
![Page 10: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/10.jpg)
Terminal: start, end
Input/Output: prompt, promptNumkeyboard input
There is only one startand one end.
Arrows connect the pieces.
Flow is up to downor left to right.
Lines do not cross.
The only shape with can have 2lines come out of it is a diamond.
No shape can have more than 2 lines come out of it.
Process: calculations
Display: output, setText
Shape Formal: informal Rules
![Page 11: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/11.jpg)
input
displayoutput
calculation
start/end
![Page 12: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/12.jpg)
Start at the
beginning
Make a flowchart for this code:
onEvent("Calculate", "click", function(event) {var Mark = promptNum ("What was your test mark? ");var Total = promptNum ("What was the test total? ");
var Per = Mark/Total*100;
setText("Per", "That was "+Per+"%");setText("Msg", "Good job");
});
![Page 13: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/13.jpg)
Start
What shape works for the
next line?
Make a flowchart for this code:
onEvent("Calculate", "click", function(event) {var Mark = promptNum ("What was your test mark? ");var Total = promptNum ("What was the test total? ");
var Per = Mark/Total*100;
setText("Per", "That was "+Per+"%");setText("Msg", "Good job");
});
![Page 14: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/14.jpg)
Start
Get test mark
And line two?
Make a flowchart for this code:
onEvent("Calculate", "click", function(event) {var Mark = promptNum ("What was your test mark? ");var Total = promptNum ("What was the test total? ");
var Per = Mark/Total*100;
setText("Per", "That was "+Per+"%");setText("Msg", "Good job");
});
![Page 15: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/15.jpg)
Start
Get test mark
Get test total
What happens
inbetweenline 2 & 3?
Make a flowchart for this code:
onEvent("Calculate", "click", function(event) {var Mark = promptNum ("What was your test mark? ");var Total = promptNum ("What was the test total? ");
var Per = Mark/Total*100;
setText("Per", "That was "+Per+"%");setText("Msg", "Good job");
});
![Page 16: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/16.jpg)
Start
Get test mark
Calculate percentage
Get test total
What shape is needed for line 3?
Make a flowchart for this code:
onEvent("Calculate", "click", function(event) {var Mark = promptNum ("What was your test mark? ");var Total = promptNum ("What was the test total? ");
var Per = Mark/Total*100;
setText("Per", "That was "+Per+"%");setText("Msg", "Good job");
});
![Page 17: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/17.jpg)
Start
Get test mark
Calculate percentage
Print percentage
Get test total
What shape for
line 4?
Make a flowchart for this code:
onEvent("Calculate", "click", function(event) {var Mark = promptNum ("What was your test mark? ");var Total = promptNum ("What was the test total? ");
var Per = Mark/Total*100;
setText("Per", "That was "+Per+"%");setText("Msg", "Good job");
});
![Page 18: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/18.jpg)
Start
Get test mark
Calculate percentage
Print percentage
Get test total
Print Good ‘Job’
How does it end?
Make a flowchart for this code:
onEvent("Calculate", "click", function(event) {var Mark = promptNum ("What was your test mark? ");var Total = promptNum ("What was the test total? ");
var Per = Mark/Total*100;
setText("Per", "That was "+Per+"%");setText("Msg", "Good job");
});
![Page 19: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/19.jpg)
Start
Get test mark
Calculate percentage
Print percentage
Get test total
Print Good ‘Job’
End
Make a flowchart for this code:
That’s all.
Gold star
onEvent("Calculate", "click", function(event) {var Mark = promptNum ("What was your test mark? ");var Total = promptNum ("What was the test total? ");
var Per = Mark/Total*100;
setText("Per", "That was "+Per+"%");setText("Msg", "Good job");
});
![Page 20: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/20.jpg)
Let’s try another.
![Page 21: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/21.jpg)
Start at the beginning
Make a flowchart for this code:onEvent("Calculate", "click", function(event) {setText("Title", "Cylinder Surface Area and Volume");var Height = promptNum ("Enter the height: ");var Radius = promptNum ("Enter the radius: ");var SA = 3.14*Radius*Radius*2 + Radius*Height;var Volume = 3.14*Radius*Radius*Height;setText("SA", "The surface area is "+SA);setText("Vol", "The volume area is "+Vol);
});
![Page 22: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/22.jpg)
Start
What shape is line 1?
Make a flowchart for this code:onEvent("Calculate", "click", function(event) {setText("Title", "Cylinder Surface Area and Volume");var Height = promptNum ("Enter the height: ");var Radius = promptNum ("Enter the radius: ");var SA = 3.14*Radius*Radius*2 + Radius*Height;var Volume = 3.14*Radius*Radius*Height;setText("SA", "The surface area is "+SA);setText("Vol", "The volume area is "+Vol);
});
![Page 23: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/23.jpg)
Start
What shape are the next
2 lines? (2&3)
Print title
Make a flowchart for this code:onEvent("Calculate", "click", function(event) {setText("Title", "Cylinder Surface Area and Volume");var Height = promptNum ("Enter the height: ");var Radius = promptNum ("Enter the radius: ");var SA = 3.14*Radius*Radius*2 + Radius*Height;var Volume = 3.14*Radius*Radius*Height;setText("SA", "The surface area is "+SA);setText("Vol", "The volume area is "+Vol);
});
![Page 24: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/24.jpg)
StartGet
heightGet
radius
What about the last two lines?
Print title
Make a flowchart for this code:onEvent("Calculate", "click", function(event) {setText("Title", "Cylinder Surface Area and Volume");var Height = promptNum ("Enter the height: ");var Radius = promptNum ("Enter the radius: ");var SA = 3.14*Radius*Radius*2 + Radius*Height;var Volume = 3.14*Radius*Radius*Height;setText("SA", "The surface area is "+SA);setText("Vol", "The volume area is "+Vol);
});
![Page 25: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/25.jpg)
StartGet
height
Print surface area
Get radius
Print volume
Hey! Where did those two
numbers come from?
Print title
Oh yeah. We missed
a step.
Make a flowchart for this code:onEvent("Calculate", "click", function(event) {setText("Title", "Cylinder Surface Area and Volume");var Height = promptNum ("Enter the height: ");var Radius = promptNum ("Enter the radius: ");var SA = 3.14*Radius*Radius*2 + Radius*Height;var Volume = 3.14*Radius*Radius*Height;setText("SA", "The surface area is "+SA);setText("Vol", "The volume area is "+Vol);
});
![Page 26: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/26.jpg)
StartGet
height
Calculate surface area
Print surface area
Get radius
Print volume
Then, what shape to end it?
Print title
Calculate volume
Make a flowchart for this code:onEvent("Calculate", "click", function(event) {setText("Title", "Cylinder Surface Area and Volume");var Height = promptNum ("Enter the height: ");var Radius = promptNum ("Enter the radius: ");var SA = 3.14*Radius*Radius*2 + Radius*Height;var Volume = 3.14*Radius*Radius*Height;setText("SA", "The surface area is "+SA);setText("Vol", "The volume area is "+Vol);
});
![Page 27: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/27.jpg)
StartGet
height
Calculate surface area
Print surface area
Get radius
Print volume
End
Make a flowchart for this code:
That’s all.
onEvent("Calculate", "click", function(event) {setText("Title", "Cylinder Surface Area and Volume");var Height = promptNum ("Enter the height: ");var Radius = promptNum ("Enter the radius: ");var SA = 3.14*Radius*Radius*2 + Radius*Height;var Volume = 3.14*Radius*Radius*Height;setText("SA", "The surface area is "+SA);setText("Vol", "The volume area is "+Vol);
});
Print title
Calculate volume
Gold star
![Page 28: Flowcharts - Gorski CompScigorskicompsci.ca/ICS2O/Unit2/ppt4_Flowcharts.pdf · Terminal: start, end Input/Output: prompt, promptNum keyboard input There is only one start and one](https://reader034.vdocument.in/reader034/viewer/2022042918/5f5cd5db81a71d6e886dc227/html5/thumbnails/28.jpg)
There is only one startand one end.
Arrows connect the pieces.
Flow is up to downor left to right.
Lines do not cross.
The only shape with can have 2lines come out of it is a diamond.
No shape can have more than 2 lines come out of it.
Rules
This diagram was drawn by an amateur: how many of the rules
did they break?