CREATING A DISK ROTATION SIMULATION

---

The rotation of a disk around a fixed axis is explained on the page Disk Rotation

The application was created using EJS version 5.3. After launching the EJS Console, you should check the path to the output folder (under Basic option), as well as ensure that the application is set to run in Javascript mode (EJSS).

If JAVA is set as the programming language, change it to Javascript. In the main window, you start creating a new simulation by clicking the NewSimulation button, as shown in the image below:

Within the model, we define the necessary variables. In the Evolution tab, we define the number of frames per second, which will change during the simulation runtime. We leave the default value of 20 FPS (frames per second). This means that if 20 frames change per second, then each frame changes every 0.05 seconds.

To create the application, let's review the mechanics laws that describe disk rotation about its axis. The first part of the task involves rotation at a constant angular velocity around a fixed axis. The task on which we base this simulation reads:

Create a simulation of a disk with mass m and radius r rotating around a vertical axis at an angular velocity ω = 1 rad/s.

---

We will first create the simulation in a two-dimensional plane, where the disk is viewed from above, as shown in the image below:

Point M, which is fixed to the disk, rotates along with the disk at angular velocity W [rad/s]. The line OM connecting the center of the circle and point M rotates by an angle φ, representing the angular displacement. Over a time interval dt between two iterations, total time is updated as:

t = t + dt

The angle changes accordingly:

dφ = ω * dt

And the new angle becomes:

φ = φ + dφ

These are the formulas to be entered in the “Evolution” section of EJS. (see image)

The variables used must be defined in the “Variable” tab. In addition to the variables used in the formulas shown earlier, Cartesian coordinates x and y should also be added. A preview of the variables, their data types, and initial values is shown in the image below:

R represents the radius of the disk, while variables razW and cssFlow are used in the graphical part of the application — as a scale and as CSS layout instructions for component alignment (like FlowLayout in Java).

The rotation of a disk around a fixed axis is further explained on the page Creating Graphic Applications in JAVA

We see that almost all variables are of type double (real numbers), except for cssFlow, which is a String. Cartesian coordinates are useful for drawing point M and can be linked to already calculated polar coordinates, which depend on time and are defined in the “Evolution” tab. All other derived variables related to these formulas should be entered in the “Fixed Relation” tab. Polar and Cartesian coordinates are linked by the relations shown in the following image:

In EJS:

The next step is to create the graphical part of the application. Switch from the model tab to the HtmlView tab. This tab is responsible for the graphical interface in the Javascript version of EJS. On the right side, there are various graphical objects for both 2D and 3D graphics.

The objects are organized as a tree structure, with SimulationView at the root. Other objects are added and connected by dragging the desired object from the palette onto the object tree on the left side. In this example, the object structure looks like the following:

The first branches added are panel components — rectangular containers that hold other components. We can see four panels: the first is the application title, panelUnos and panelPrikaz contain input and output fields for physical values, respectively, as their names suggest. The fourth panel, “container”, contains two sub-panels — one for 2D rotation display, and another for 3D display.

For a detailed explanation on how to create the application, watch the attached video. The objects that need to be placed on the 2D simulation display panel “singleDrawingPanel” are shown in the next image:

When an object is selected from the interface palette, such as a singleDrawingPanel, it is added to the tree of elements along with its entire group of required sub-objects. For 3D visualization, a Drawing3DPanel object is added from the same palette, and its structure is shown in the figure. The detailed structure of objects on the 2D panel is shown in the following figure:

The following objects are placed on the drawing panel (drawingPanel):

1. 1. rotacioniDisk (2D shape) from the 2D Drawables palette, actually represents a circle (top view of the disk)
2. 2. marker (segment), a line segment that follows the rotation of the disk. The line connects the center of the disk with point M on the disk’s edge
3. 3. osa (2D shape), also a circle, represents the rotation axis as seen from above
4. 4. trail (2D trail), a curved line (circular arc) showing the angle of rotation
5. 5. pocetakUgla (segment), a line indicating the initial position of the marker, when the rotation angle was zero

By clicking on a particular object, for example on rotacioniDisk, you can change its properties, as shown in the next image:

The values X, Y and SizeX, SizeY define the rectangle into which the ellipse is drawn — in this case, it becomes a circle because the width and height of the rectangle are equal to R*2 (the disk's diameter). X and Y are the coordinates of the top-left corner of the rectangle in which the ellipse (circle in this case) is inscribed.

The properties of the line segment marked as marker can be seen in the next figure:

X and Y are the coordinates of the line's starting point, while SizeX and SizeY are the legs of the right triangle obtained when the hypotenuse OM (the line segment - marker) is projected onto the x and y axes (see the image below).

Some graphical object properties can be linked to variables and their values. For example, the rotation trail can be linked to Cartesian coordinates x and y so the trail follows the current values. The set of points representing all current trail positions forms a circle centered at point O (disk rotation center), with a radius equal to a portion of the disk radius — in our case, 0.3 of the disk's radius (see properties SizeX and SizeY in the next figure). The properties that need to be defined to obtain the trail are also shown in the same image.

The InputX and InputY properties can be linked to variables by clicking the second button to the right of the Input field (the one with the chain icon).

CREATING A 3D SIMULATION VIEW

Read more about this on the webpage:

Disk Rotation Simulation - 3D View