GlowScript: Difference between revisions
mNo edit summary |
|||
(18 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
GlowScript is an intuitive website used to create 3D animations and share them on the web. Programs can be written right in your browser, stored on the cloud for free, and easily shared with a link.<br> | GlowScript is an intuitive website used to create 3D animations and share them on the web. Programs can be written right in your browser, stored on the cloud for free, and easily shared with a link.<br> | ||
GlowScript supports both VPython, JavaScript, and CoffeeScript, however for the purposes of this course, | GlowScript supports both VPython, JavaScript, and CoffeeScript, however for the purposes of this course, programs are written in VPython.<br><br> | ||
All labs are completed in GlowScript.<br><br> | |||
== glowscript.org == | == glowscript.org == | ||
Once signed in, select the bolded word '''here''' to open your programs.<br> | Once signed in, select the bolded word '''here''' to open your programs.<br> You should be able to long in with your google account to see the different tabs for the public and private folders either to share with others the program that was done. | ||
'''Example Programs''' provides examples of all the capabilities of the GlowScript website. | '''Example Programs''' provides examples of all the capabilities of the GlowScript website. It allows you to edit the programs and fix around the coding for your preference. Can see how others are using GlowScript. '''Link:''' https://www.glowscript.org/#/user/GlowScriptDemos/folder/Examples/ | ||
'''Forum''' opens a Google Group page where anyone can ask questions or voice concerns regarding the use of GlowScript. | '''Forum''' opens a Google Group page where anyone can ask questions or voice concerns regarding the use of GlowScript. You can discuss with other members but responding time can take aa bit of time since it's through email. '''Link''': https://groups.google.com/g/glowscript-users | ||
'''Help''' in the upper right offers basic | '''Help''' in the upper right offers basic instructions on how to use the website including how to get started and how to use the text editor. shows you how to get started and be able to use the functions properly. '''Link:''' https://www.glowscript.org/docs/VPythonDocs/index.html | ||
== Writing a Program == | == Writing a Program == | ||
Select '''Create New Program''' to create a new program in the desired folder. Names for programs cannot include spaces or underscores. New folders and programs can be set as either private or public.<br> | |||
'''Run this program''' in the upper left will run the program. You should be able to do screenshots as well when running the program; afterwards the program | |||
'''Share or export this program''' opens a page containing instructions on the different ways available to share your code. | |||
- There are actually many ways to share a program with others to see your code and see the model created for the program | |||
To share program, you can publish link to an entire public folder. | |||
Another option is to save the HTML in a file ending in ".html". | |||
Sometimes you may need to allow anyone to run the program to test the code to see if it's running well. If you encounter any errors, you should go back and fix the V3 python code once again and run the program once more. | |||
== Introduction to Vpython== | |||
=== Header === | === Header === | ||
'''GlowScript 3.0 VPython''' is required in header to run Vpython. | '''GlowScript 3.0 VPython''' is required in header to run Vpython. | ||
=== Comments === | |||
A comment is a line of code that is not run.<br> | |||
Begin any line with '''#''' to create a comment. Comments are not only useful to the writer to help them keep track of their own code, comments also allow other people using your code to keep track of what your program is executing.<br> | |||
Deleting '''#''' from the beginning of a line of code will result in that line of code running next time the code is run. | |||
Comments help readers to understand the logic behind the coding and being to see what was the process of the code. | |||
Comments are helpful in codes and is very useful to use them in python code just in case the code can indeed get messy and be long. | |||
=== Initialize new Variables === | === Initialize new Variables === | ||
Use <b>var</b> and assign values.<br> | Use <b>var</b> and assign values.<br> | ||
var x, y | var x, y | ||
Line 30: | Line 51: | ||
y = 3 | y = 3 | ||
Variables in python helps with being able to classify and you can be able to change them as well depending on the numbers that you use. | |||
You can also print variables as well with the print function because just leaving it like this will not help | |||
You have int(), bool(), float (), str(), and many other variables that can help with such coding. | |||
=== 3D Objects === | === 3D Objects === | ||
<b>Arrow</b> | <b>Arrow</b> | ||
newArrow = arrow(pos=vec(x0, y0, z0), shaftwidth=1, axis_and_length=vec(x1, y1, z1)) | newArrow = arrow(pos=vec(x0, y0, z0), shaftwidth=1, axis_and_length=vec(x1, y1, z1)) | ||
Line 45: | Line 71: | ||
This creates a box with a center <x0, y0, z0> and with size <x1, y1, z1><br><br> | This creates a box with a center <x0, y0, z0> and with size <x1, y1, z1><br><br> | ||
A arrow is a geometrical object in three-dimensional space that is a straight line with a pointed end. | |||
'''Syntax:''' arrow (parameters) | |||
'''Parameters:''' | |||
'''Pos:''' this will be the position of the beginning of the shaft of the arrow. | |||
'''axis:''' it is the axis of alignment of the arrow | |||
up is the orientation of the arrow | |||
'''Color:''' you can also add color as well for example color = vector(1,1,1) | |||
=== Customizing Objects === | === Customizing Objects === | ||
<b>Color</b><br> | <b>Color</b><br> | ||
There are 10 default colors that can be used. | There are 10 default colors that can be used. | ||
Line 54: | Line 90: | ||
color.blue, color.cyan, color.magenta, color.purple | color.blue, color.cyan, color.magenta, color.purple | ||
color.black, color.white | color.black, color.white | ||
Colors can be customized | Colors can be customized with the following code. | ||
vec(1, 0.5, 0.3) | vec(1, 0.5, 0.3) | ||
In this case, R is 1, G = 0.7, and B = 0.2, which has color of pastel orange.<br><br> | In this case, R is 1, G = 0.7, and B = 0.2, which has color of pastel orange.<br><br> | ||
Line 61: | Line 97: | ||
rate(50) | rate(50) | ||
This line will halt each computations to have interval of 1.0/50.0 second. | This line will halt each computations to have interval of 1.0/50.0 second. | ||
Animation speed allows you to see how fast the object will move or change around the axis. | |||
There are also vector operations: | |||
'''- Vector operations:''' Magnitude, dot and cross product, rotation,etc. | |||
'''- Graphs:''' can make graphs of data | |||
'''- Math functions:''' includes statistics functions | |||
== Textures == | |||
There are 12 textures available to use. | |||
textures.flower, textures.granite, textures.gravel, textures.metal, | |||
textures.rock, textures.rough, textures.rug, textures.stones, | |||
textures.stucco, textures.wood, textures.wood_old, textures.earth | |||
For example, to make a box with a rug texture, the following code should be used. | |||
box(texture=textures.rug) | |||
You can also use an external image as your texture by inserting the image's URL. | |||
texture="https://s3.amazonaws.com/glowscript/textures/flower_texture.jpg" | |||
== Example Program == | |||
This program runs in Trinket, a feature of GlowScript. When this program runs, a wood box and a sphere with a flower on it will appear next to each other.<br> | |||
<iframe src="https://trinket.io/embed/glowscript/6372be2c9e" width="100%" height="356" frameborder="0" marginwidth="0" marginheight="0" allowfullscreen></iframe> | |||
== Supported Environments == | == Supported Environments == | ||
Line 66: | Line 126: | ||
<b>Browsers</b>: Chrome, Firefox, Safari, Internet Explorer, and Edge. Chrome and Edge are recommended.<br> | <b>Browsers</b>: Chrome, Firefox, Safari, Internet Explorer, and Edge. Chrome and Edge are recommended.<br> | ||
<b>Devices</b>: Most smart devices running Android or iOS.<br> | <b>Devices</b>: Most smart devices running Android or iOS.<br> | ||
== Connectedness == | |||
GlowScirpt will be used in all labs to find ideal data that is compared to observed data. | |||
== History == | |||
David Scherer and Bruce Sherwood began working on GlowScript in May 2011. GlowScript 0.7 was released to the public in January of 2012. The website originally only ran using VPython, but grew to support JavaScript and CoffeeScript a year later. Website began supporting textures, then straight-lined shapes, text, and eventually curves. CoffeeScript was also removed due to its low use. GlowSript currently operates on version 3.0. | |||
== See Also == | |||
===Further Reading === | |||
Below are links to other Physics Book pages that discuss VPython in much more depth.<br> | |||
[http://www.physicsbook.gatech.edu/VPython/ VPython]<br> | |||
[http://www.physicsbook.gatech.edu/VPython_basics/ VPython Basics]<br> | |||
[http://www.physicsbook.gatech.edu/VPython_Common_Errors_and_Troubleshooting/ VPython Common Errors and Troubleshooting]<br> | |||
[http://www.physicsbook.gatech.edu/VPython_Functions/ VPython Functions]<br> | |||
[http://www.physicsbook.gatech.edu/VPython_Loops/ VPython Loops]<br> | |||
[http://www.physicsbook.gatech.edu/VPython_3D_Objects/ VPython 3D Objects]<br> | |||
=== External Links === | |||
[https://rhettallain_gmail_com.trinket.io/numerical-calculations-in-physics#/numerical-calculation-tutorials/introduction-and-vectors/ GlowScript VPython tutorials by Rhett Allain] | |||
== References == | |||
https://www.glowscript.org/docs/VPythonDocs/index.html<br> | |||
https://www.glowscript.org/docs/VPythonDocs/history.html |
Latest revision as of 12:44, 23 November 2020
GlowScript is an intuitive website used to create 3D animations and share them on the web. Programs can be written right in your browser, stored on the cloud for free, and easily shared with a link.
GlowScript supports both VPython, JavaScript, and CoffeeScript, however for the purposes of this course, programs are written in VPython.
All labs are completed in GlowScript.
glowscript.org
Once signed in, select the bolded word here to open your programs.
You should be able to long in with your google account to see the different tabs for the public and private folders either to share with others the program that was done.
Example Programs provides examples of all the capabilities of the GlowScript website. It allows you to edit the programs and fix around the coding for your preference. Can see how others are using GlowScript. Link: https://www.glowscript.org/#/user/GlowScriptDemos/folder/Examples/
Forum opens a Google Group page where anyone can ask questions or voice concerns regarding the use of GlowScript. You can discuss with other members but responding time can take aa bit of time since it's through email. Link: https://groups.google.com/g/glowscript-users
Help in the upper right offers basic instructions on how to use the website including how to get started and how to use the text editor. shows you how to get started and be able to use the functions properly. Link: https://www.glowscript.org/docs/VPythonDocs/index.html
Writing a Program
Select Create New Program to create a new program in the desired folder. Names for programs cannot include spaces or underscores. New folders and programs can be set as either private or public.
Run this program in the upper left will run the program. You should be able to do screenshots as well when running the program; afterwards the program
Share or export this program opens a page containing instructions on the different ways available to share your code. - There are actually many ways to share a program with others to see your code and see the model created for the program
To share program, you can publish link to an entire public folder.
Another option is to save the HTML in a file ending in ".html".
Sometimes you may need to allow anyone to run the program to test the code to see if it's running well. If you encounter any errors, you should go back and fix the V3 python code once again and run the program once more.
Introduction to Vpython
Header
GlowScript 3.0 VPython is required in header to run Vpython.
Comments
A comment is a line of code that is not run.
Begin any line with # to create a comment. Comments are not only useful to the writer to help them keep track of their own code, comments also allow other people using your code to keep track of what your program is executing.
Deleting # from the beginning of a line of code will result in that line of code running next time the code is run.
Comments help readers to understand the logic behind the coding and being to see what was the process of the code.
Comments are helpful in codes and is very useful to use them in python code just in case the code can indeed get messy and be long.
Initialize new Variables
Use var and assign values.
var x, y x = 2 y = 3
Variables in python helps with being able to classify and you can be able to change them as well depending on the numbers that you use.
You can also print variables as well with the print function because just leaving it like this will not help
You have int(), bool(), float (), str(), and many other variables that can help with such coding.
3D Objects
Arrow
newArrow = arrow(pos=vec(x0, y0, z0), shaftwidth=1, axis_and_length=vec(x1, y1, z1))
This creates arrow that starts at point <x0, y0, z0> that points <x1, y1, z1>
Box
newBox = box(pos=vec(x0, y0, z0), size=vec(L, H, W))
This creates a box with a center <x0, y0, z0> and with size <L, H, W>
Sphere
newSphere = sphere(pos=vec(x0, y0, z0), size=vec(x1, y1, z1) )
This creates a box with a center <x0, y0, z0> and with size <x1, y1, z1>
A arrow is a geometrical object in three-dimensional space that is a straight line with a pointed end.
Syntax: arrow (parameters)
Parameters:
Pos: this will be the position of the beginning of the shaft of the arrow. axis: it is the axis of alignment of the arrow up is the orientation of the arrow Color: you can also add color as well for example color = vector(1,1,1)
Customizing Objects
Color
There are 10 default colors that can be used.
color.red, color.yellow, color.green, color.orange color.blue, color.cyan, color.magenta, color.purple color.black, color.white
Colors can be customized with the following code.
vec(1, 0.5, 0.3)
In this case, R is 1, G = 0.7, and B = 0.2, which has color of pastel orange.
Animation Speed
rate(50)
This line will halt each computations to have interval of 1.0/50.0 second.
Animation speed allows you to see how fast the object will move or change around the axis.
There are also vector operations: - Vector operations: Magnitude, dot and cross product, rotation,etc. - Graphs: can make graphs of data - Math functions: includes statistics functions
Textures
There are 12 textures available to use.
textures.flower, textures.granite, textures.gravel, textures.metal, textures.rock, textures.rough, textures.rug, textures.stones, textures.stucco, textures.wood, textures.wood_old, textures.earth
For example, to make a box with a rug texture, the following code should be used.
box(texture=textures.rug)
You can also use an external image as your texture by inserting the image's URL.
texture="https://s3.amazonaws.com/glowscript/textures/flower_texture.jpg"
Example Program
This program runs in Trinket, a feature of GlowScript. When this program runs, a wood box and a sphere with a flower on it will appear next to each other.
<iframe src="https://trinket.io/embed/glowscript/6372be2c9e" width="100%" height="356" frameborder="0" marginwidth="0" marginheight="0" allowfullscreen></iframe>
Supported Environments
Browsers: Chrome, Firefox, Safari, Internet Explorer, and Edge. Chrome and Edge are recommended.
Devices: Most smart devices running Android or iOS.
Connectedness
GlowScirpt will be used in all labs to find ideal data that is compared to observed data.
History
David Scherer and Bruce Sherwood began working on GlowScript in May 2011. GlowScript 0.7 was released to the public in January of 2012. The website originally only ran using VPython, but grew to support JavaScript and CoffeeScript a year later. Website began supporting textures, then straight-lined shapes, text, and eventually curves. CoffeeScript was also removed due to its low use. GlowSript currently operates on version 3.0.
See Also
Further Reading
Below are links to other Physics Book pages that discuss VPython in much more depth.
VPython
VPython Basics
VPython Common Errors and Troubleshooting
VPython Functions
VPython Loops
VPython 3D Objects
External Links
GlowScript VPython tutorials by Rhett Allain
References
https://www.glowscript.org/docs/VPythonDocs/index.html
https://www.glowscript.org/docs/VPythonDocs/history.html