Help Index

Virtual Harmonograph Help

Copyright © 2016 JM Gustafson, WorldTree Software


A harmonograph is a mechanical device that employs pendulums to create a picture called a harmonogram. Virtual Harmonograph replaces the mechanical device with a computer application so you can create them without having to build one.

This application emulates a real-world harmonograph with any number of pendulums. Drawing a harmonogram on a flat 2-D surface you can have up to four pendulums. A harmonograph with two pendulums is called a lateral harmonograph. A harmonograph with four pendulums is called a rotary harmonograph. Two of them control the horizontal and vertical movement of the pen, and two of them control the movement of the drawing surface.

Virtual harmonograph also allows you to rotate the drawing surface back and forth in an arc. Think of it as a swing. You can wind it up and let go and it will unwind then wind back up again until it runs out of energy.

Using one horizontal and one vertical pendulum produces simple Lissajous curves. Using two horizontal and two vertical pendulum produces more sophisticated curves. Play around with different numbers of pendulums and rotation amounts to see what you come up with and let me know of any interesting results you get.

You can also add what I call "pseudo-pendulums". These pseudo-pendulums control pen width, pen color, and pen opacity. You specify two values and it uses the same pendulum algorithm to move between the two values. For example, you might have a pseudo-pendulum for pen color where color 1 is red and color 2 is blue. As the harmonograph is drawn the color will gradually change from red to blue and back to red. It produces some very interesting results.

For a complete tutorial on lateral and rotary harmonographs and how to create them using Virtual Harmonograph read Intro to Harmonographs.

Browser Requirements

Virtual Harmonograph is an HTML5 web application. It requires a browser that supports HTML5 features such as local storage and canvas. Some examples of supported browsers are IE 10+, Firefox 3.5+, Chrome 4+ and Safari 4+. I recommend Chrome as it has the best support for HTML5.

Note: Because javascript can't access the local file system, this application uses your browser's local storage feature to save harmonographs. Therefore if you save a harmonograph on one computer it will not be available if you use a different computer or browser. Use the export/import feature to move harmonograms between computers or share them with others.

Views Pane

The views pane is on the left side of the screen and shows different views depending on the context. The default view is the harmonograph properties. The view will change depending on what action you are currently performing. If you are loading a graph it will show the load graph view. If you are exporting a graph it will show the export view. When you are done performing the action it always goes back to the default properties view.

At the top of the views pane is the name of the harmonograph. Click the expand button next to the name to also show the description field.

The views pane can be collapsed to the left by clicking the minimize button. This will give you more room to view the harmonograph. To restore the pane click the restore button. You may also unpin the settings view by clicking the pin button. This will make the view pane float over top of the harmonograph.

The following views are available:

Harmonograph Properties View

The properties view is where you define the parameters for the harmonograph. It contains these tabs: Settings, Pendulums, Graphics, Visualization.

Settings Tab

This tab defines general settings of the harmonograph.

Pendulums Tab

This tab is used to define the pendulums. It contains a list of all of the pendulums. Click on a pendulum in the list to edit its properties. Use the buttons below the list to modify the list.


X-Axis and Y-Axis properties:

Rotation properties:

Pen Color properties:

Pen Opacity properties:

Pen Width properties:

Graphics Tab

This tab contains settings that determines graph colors and how the graph is drawn.

Visualization Tab

This tab contains settings that allow you slow down the harmonograph and see the pen position so you can see how it works.

Load Graph View

The load graph view is where you can select a graph to load. You can either load a graph from your browser's storage or from your device's file system. To load from a the file system click the Choose File button and select a file that was saved using Virtual Harmonograph. To load from browser storage select a graph in the list and click the Open button.

You can remove graphs from the browser's storage by selecting a file in the list and clicking the delete button.

Export Graph View

The export graph view is where you can choose how to export a graph. You can either export the harmonograph's settings to your device's file system, export it as an image, or get a URL that will draw the harmonograph.




Please contact me here if you have any questions, suggestions, comments or bugs to report-- or if you would like to be notified when new versions are released. Also send me any cool harmonograph settings you may come up with (use the export feature). I would like to see them.


Virtual Harmonograph is free to use. It may not be copied to any other server without the author's consent. Copyright © 2015 by JM Gustafson. All rights reserved.