This site shows you an OBJECT-ORIENTED, DATA-FLOW-BASED, EVENT-DRIVEN graphical programming language and its environment (called VPGL). This includes simple 3D Graphic features described later.
(1) The first example – Summation by loop.
This program calculates the summation of 1 to 10 (1+2+3+…+10) example.
The result will be emitted to Left of Tile A4 which is labeled “O0”.
You can see the result by press “RUN” Button.
This language is in “DATA-FLOW DIAGRAM” which passes data tokens from tile to tile.
In this case , “10” has specified by Mainline and been thrown in to Top of Tile D1 which is labeled “I0”.
Method “WJCT” at C3 is a user-defined and waits for arriving both input tokens and passes 0 to 0 (top to right) and 1 to 1 (left to bottom), and method “END” at F5 discards the input token.
(To try VPGL, need enabling JavaScript on this site.)
Method “GT” at D4 with operand 0 emits “true” token if the arrived token is greater then 0, otherwise emits “false” token. GT is system-defined
Method “IF” – conditional switch – at C5 and E5 pass input 1 token to output 0 if input 0 is “true” token, pass input 1 to output 1 otherwise. IF is system-defined
Method “END” at F5 discards the input token to clear unused tokens at exit of this Method. END is system-defined.
This diagram has 2 feed-back loop, left one (B7-B3) for accumulated value, and right one (E7-C2) for loop index starting with N(=10) down to 0.
(2) Summation by recursion.
In this language, looping requires tiles for feedback path as you can see on the first example. Repeating by recursion is effective instead like follows:
“SIGMA” at D4 is recursive call of SIGMA itself. This definition is more simple than the first example with looping because this has no feedback path.
(3) OBJECTIVE summation.
Following summation definition use Object-Oriented feature of this language. VPGL has 3 system-defined sub-class for numeric class Number. They are Zero, Positive and Negative. All system-defined arithmetic methods including A+B of Number class (described as Number::A+B later) automatically make result instance of these classes according to their arithmetic operations. For example, 3+4 makes 7 token of Positive class, 3+(-3) makes the Zero (singleton) token and 3+(-4) makes -1 token of Negative.
Using this feature, SIGMA implementation is divided into 3 Classes. Zero::SIGMA and Negative::SIGMA is defined as always emits the Zero token, then Positive::SIGMA is :
VPGL with 3D
VPGL has a simple 3D graphic feature as below. These object manipulation and event handling is written in VPGL “Graphic Language”. They are implemented by 20-50 diagrams such like above.
An example is a simple railway toy. Try left link.
NEXT :
If you feel learn more, try to visit following topics.
- How to read VPGL diagram through simple examples
- How To “Code” – draw diagrams
- Examples in VPGL
- More VPGL examples
- Language Reference – Data types and methods
Followings are building 3D appliaction track. They are in easy-to-hard order. You would be better to go in this order.
- A basic 3D application tutorial.(HW Track)
- Building Railway Toy application.(RR Track)
- Other 3D Examples.(UC)
NOTE:
This VPGL GUI/Execution environment is written in HTML5+JavaScript only. This will run on web-browsers(Edge, Chrome, Safari, FireFox etc.) on your device. As you know, these web browser can interpret JavaScript Language program. VPGL use this browser feature. So VPGL interacts to server only loading scripts and page.