Download ModelDownload SourceembedLaunch Website


Intro Page

Animated Möbius strip

and other 3D strips

This function plotter displays animated surfaces in 3D that may be closed or intersecting. Its predefined function presents open or closed twisted bands, among them the famous Möbius strip.

x = fx( p, q , t ); y = fy( p, q, t ); z = fz( p, q, t )

The coordinate functions fx, fy,, fz , which in the simulation are shown in three editable text fields, map the points of the plane of variables p, q unambiguously into a surface in space x y z . If fx, fy,, fz contain periodic functions of the variables p and q, closed or intersecting surfaces may be produced.

The functions may contain three constants a, b, v that can be changed by sliders. In the predefined functions v is used to animate the surfaces by oscillating one or more of the coordinates via time dependent terms.

At start of the simulation you will see the projection of a closed band in space, viewed under perspective distortion. It is embedded into an x y z tripod, and is accompanied by the x y- plane z = 0. This plane can be deactivated by its check box.

The band is a Möbius strip, which is a band twisted by one half turn. It has only one surface: when one walks around its axis in the xy-plane, one passes both sides of the strip without needing to penetrate the surface.

The 3 coordinate functions contain periodic modulation terms, controlled by time t and the parameter v, which is defined by slider v:

fx = cosp (1+q/2π cos(a/2 p-vt)

fy = sinp (1+q/2π cos(a/2 p-vt)

fz = b q/2π sin(a/2 p-vt)

The height of the band is defined by slider b.

Slider a defines the number of half turns of the band. For an integer the band is closed. a =  1 results in the Möbius strip. With a > 0 an even integers create normal bands with 2 surfaces and a/2 full twists. With a an uneven integer Möbius-similar bands are created with a half twists.

If a is not an integer, the band is not closed. By varying a a closed band can be cut open and closed again for a different number of half twists. Slider a is adjusted in such a way that it jumps to the next integer, when a is close to one.

Play starts the animation program by increasing t linear in time, starting from zero. The periodic modulation generates a band that is rotating around its symmetry axis. Slider v defines the speed of rotation. Pause freezes the animation at any orientation, Reset recreates the initial parameters and projection.

Scales of x, y z extend from -1 to +1 . The x y-plane crosses the z-axis at z = 0.

The range of variables p and q extend from to +π, creating full cycles in the periodic terms.

The orientation of the tripod in space can be changed by drawing with the mouse.

Other ways of visualization are described in the next page.

You can edit the formulas in the formula fields or input completely different ones. Don not forget to hit the ENTER key after every change.


Visualization alternatives

Rotation:  Mark any point within the tripod using the mouse pointer and draw (while the left mouse key stays pressed).

Shift:  Draw while the Strg key is pressed.

Zoom:  Draw while the Shift key is pressed.

Correction: To return to the default projection activate Reset.

Show coordinates:  Mark a point on the surface while pressing the Alt key. When you draw, a cutting plane will pass through the surface. Depending on orientation, different cuts can be evaluated.

Camera- Inspector: Press the right mouse key. A context menu will appear. Choose Elements option/ drawing 3D panel/ Camera. The Camera Inspector will appear. It will stay visible until it is deactivated. It offers the following options:

Perspective:  Distant lines appear shorter than near ones.

No perspective:  No perspective distortion.

Planar xy or yz or yx : One looks onto the respective planes.

Other options: Degree and angle of perspective can be defined.

Optimizing  parameters. The spatial impression can be optimized by adjusting parameters. The optimum will be different for different projections.

The context menu also offers programs for producing a picture or a video.


These are the predefined functions for the bands (as code in InitPage)

x_functions = "cos(p)*(1+q/(2*pi)*cos(a/2*p.v*t))";

y_functions = "sin(p)*(1+q/(2*pi)*cos(a/2*p-v*t))";

z_functions = "b*q/(pi)*sin(a/2*p-v*t)";

pi  = π

a number of half twists

a = 1.0 common Moebius strip.

b defines height;

p and q range to


E1: Run the animation and rotate the 3D frame. Follow the band around its periphery with the mouse pointer to confirm that it has a single surface, yet two sides.

E2: Choose a = 0. You will see a truncated, reversing cone. With b = 0 a breathing ring is displayed.

E3: Reset. Vary a from 1 to a slightly higher value. The band will be cut. When will it be closed again?

E4: When do you get Möbius type strips, when normal bands?

E5: Change signs in the formulas and observe the results.

E6: Make more drastic changes in the formulas, trying to still create bands.

E7: Consider beforehand what kind of band will be created by a certain change.

E8: Work with different modulation terms.

E9: Delete the modulation term and use the now free parameter v in the formulas.

E10: Load the Camera Inspector (use the right mouse key, search in the uppermost line of the appearing context menu).  Test the various projections. Change a and interpret the results.

E11: Can you construct formulas for a band with a knot?



Code Language Translator Run

Software Requirements


Android iOS Windows MacOS
with best with Chrome Chrome Chrome Chrome
support full-screen? Yes. Chrome/Opera No. Firefox/ Samsung Internet Not yet Yes Yes
cannot work on some mobile browser that don't understand JavaScript such as.....
cannot work on Internet Explorer 9 and below



Dieter Roess - WEH- Foundation; Fremont Teng; Loo Kang Wee

end faq

{accordionfaq faqid=accordion3 faqclass="lightnessfaq defaulticon headerbackground headerborder contentbackground contentborder round5"}

Sample Learning Goals


For Teachers

Eye Catcher 3D Surface JavaScript Simulation Applet HTML5



Control Panel

Toggling the show xy plane will toggle it's visibility.
(xy plane check off)

(xy plane check on)
Adjusting the rest of the sliders will change it's shapes.
(Example 1)
(Example 2)

(Example 3)

(Example 4)

Analytical Curve Function Fieldboxes

This allows you to see and edit the functions of the object surface freely.

Toggling Full Screen

Double clicking anywhere in the panel will toggle full screen.

Play/Pause and Reset Buttons

Plays/Pauses and resets the simulation.






Other Resources


end faq

{accordionfaq faqid=accordion4 faqclass="lightnessfaq defaulticon headerbackground headerborder contentbackground contentborder round5"}

1 1 1 1 1 1 1 1 1 1 Rating 0.00 (0 Votes)