NuWebKit

2026-03-19T16:55:34Z

Rsalter:

NuWebKit is a technology for building powerful simulations that run in a Web browser. It consists of applications and APIs that support the design of models along the lines of NetLogo (NL), but using conventional languages such as Java, JavaScript (JS) and Python.<ref>This API is under development.</ref> These applications are deployed either from a remote server, such as Amazon Web Services (AWS) Elastic Beanstalk (AWSEB), (or, in Java mode, any other server that supports WebSockets, or in JS mode, from any conventional Web or Cloud server); alternatively, they can be run locally without using any network connectivity using a ''localhost'' server. JS development only requires text editing, and Java development can take advantage of the Eclipse J2EE (Jakarta) platform using the Apache Tomcat server.

NuWebKit uses the D3 JavaScript library for rendering high quality dynamic visualizations.

This document describes the NuWebKit architecture, APIs and applications. Tutorials, documents describing example models, and a complete user manual, are forthcoming. Click [[WebKit Examples|here]] to access NuWebKit examples.

== NuWebKit Concepts ==
A simulation program is a system that maintains a global state that evolves over time. A simulation is starts in some initial state, and incurs state changes following successive strobes from an external source (which we call the '''clock'''). The state may consist of a single data value or multiple data values mapped out over the internal structure of the simulation. An example of the former is a simple simulation of exponential growth, where the current population is the only value of interest. The latter is exemplified by a spatial or agent based model where simulation state is distributed over individual agents or cells. At each time step the state change algorithm determines the new state from the current and possibly past states of the system. As the simulation runs, the user is presented with displays that illustrate the simulation's state. Time in a simulation is measured in clock ticks which may be mapped to model-time values. A simulation may run for a fixed interval, or may operate in an unbounded time frame.

A ''spatial'' simulation models a domain of cells or network nodes organized topologically as a tesselation of 2- or 3-dimensional space, in a Cartesian, or, possibly, hexagonal lattice. Cells have a fixed location and one intrinsically allocated state value, a real number which is associated with a color.

In an agent-, or individual-based model, agents exist in the space defined by the spatial topology and are mobile. In addition to location, their intrinsic state values include color and size. Optionally, speed and direction ("theta"<ref>"phi" values are also intrinsic for 3-d models</ref>) values can be assigned that direct movement. We use the term ''SimWorld'' to refer to the combined cell/agent universe.

The NuWebKit platform uses a Web browser to create a ''presentation'' of the simulation to the user. The presentation is separate from the model logic that determines the state evolution of the program, even when both are running on the client. When client and server are both used to execute a simulation, a WebSocket facilitates communication between the presentation and model logic. Consequently, the user must first connect the presentation to the model logic. This step is maintained even for client-side-only deployment, for the sake of uniformity. Disconnecting and reconnecting is a simple and reliable way of restarting a session.

To assist with model creation NuWebKit provides a '''Project Manager''' application. Using this, the programmer creates a Project '''blueprint''', essentially a file containing the Project DNA, stored separately from the project directories. The Project Manager reads this file and first parses the JSON contained in the blueprint to weed out any errors. Once a blueprint is correct, the Project Manager creates directory structures for the project, adds the project DNA file constructed from the blueprint, and inserts runnable but empty Java or JS source files for the model logic. As the project develops, changes may be made to the actual project DNA to fine tune the application. The Project Manager also has a function for retrieving deployed Project DNA files and correcting the blueprint, so that using the workflow recommended in a later section, the blueprint will always be current.

We next explore simulation programs from the point of view of the user, and then discuss how these programs are organized architecturally and in terms of their model logic.

=== User Experience ===
[[File:app.png|thumb|NuWebKit User Interface]]
This image shows the browser window running the sample agent-based application "Rock Paper Scissors", with the following features:
;Model Inputs
:These sliders set parameters for the simulation. Changes are forwarded even while the simulation is running and my have immediate effect.
;Timers
:These windows show the current model time. The left window counts up from 0. If the simulation is designed to run for a fixed time period, the right timer window will be initialized to that time and will count down.
;Operating Buttons
:The '''Connect/Disconnect''' buttons activate/deactivate the WebSocket, with the '''Connect''' button initializing the application. (Note that this functionality is maintained in the JS platform for the sake of uniformity.) Disconnecting and Connecting is one way to restart the application; reloading the page is another.
:The '''Reset''', '''Step''' and '''Start/Stop''' buttons operate the simulation. '''Step''' executes a single time step, '''Start/Stop''' bring about continuous operation, and '''Reset''' restores the initial state and resets the timers. Double-clicking '''Reset''' also reinitializes the application.
[[File:browser.png|thumb|Web Page With Side Panel Displayed]]
;Speed Control
:This determines the real-time interval between steps.
;Displays
:A spatial or agent-based simulation will include a "SimWorld" display that uses graphic cues to show the current state of the model. Among these cues are location and color, for both cells and agents, and, additionally, size and shape for agents.
:Other displays such as Spys (showing a single current value) graphs, tables, etc. are specified in the Project file (see below).
;Side Panel
:The browser page has a side panel. Use [[File:sideicon.png]] to toggle visibility (you may have to make the browswer wider to see the panel). Currently this side panel contains model documentation and a log window for WebSocket status reports. A dashboard for altering some properties of the displays, such as the dimensions of the SimWorld, is forthcoming.

=== System Architecture ===
[[File:arch0.png|thumb||Basic Architecture]]
NuWebKit architecture revolves around 5 major structures. Refer to the diagram on the right to understand the organization of these items.
;Project
:The ''Project'' (or Project "DNA"), is a JSON<ref>JSON (JavaScript Object Notation) is a standard format for storing and exchanging data. It's a lightweight, text-based format that's easy to read by humans and machines.</ref> object contained in a text file, specifying the parameters that configure the elements of both the simulation and the presentation. Details will be given below. If the Project Manager is used to initialize a a project, the programmer first creates a '''blueprint''', essentially the Project DNA file in a separate directory. As mentioned above, the Project Manager uses the blueprint to create a new runnable (but semantically empty) project.

;Presentation
:The ''Presentation'' supports visualization and user inputs in the browser. This structure is usually constructed directly in the Presentation API from the data contained in the Project JSON object. All elements of the project pertaining to the visualization and input portal required by the project. These include the agent/cell display (the "SimWorld" display), graphs, tables, etc. Specifications for this aspect are almost always covered by the contents of the Project file and require no attention from the model programmer.<ref>There are exceptions. One will be presented in a subsequent example.</ref>
;Simulator
:The ''Simulation'' structure, which contains the "business logic" for the model. This consists of 2 parts: the simulation API, which defines the data structures and methods used in the model, and the model itself. The simulation API supports the "turtle/patch" abstraction for agent-based models (ABMs), familiar from NL, but contains some additional capabilities, such as a network basis that substitutes for the patch abstraction, and support for system dynamics models using stocks and flows that can integrate with the ABMs. The simulation API is also configured directly by the Project DNA structure. Model designers can focus entirely on the model structure. One crucial property that we will insist be maintained is that changes to all parts of state occur simultaneously. In other words, any algorithm used to determine one part of a new state only relies on the current or past state of itself and any other part of the state, so that the order in which different parts of the state are computed is immaterial to the outcome.
;Clock
:''Clock'' refers to an external module that provides signals or ''strobes'' to the simulation for it to update its state. The clock is controlled from the user console in the browser and can be programmed so that the interval between strobes represents a particular interval of model time (called ''dt'').
;Dispatcher
:This unit facilitates communication between presentation and simulation elements of the application. When a project is loaded into the browser and communication is established, the dispatcher initializes a new simulator with its required parameters. The dispatcher communicates control signals from the presentation to operate the simulator, and any parameter changes that result from user gestures on sliders, switches or other input components. In response, the simulator uses the dispatcher to forward data (called a ''status report'') to the presentation that it needs to update its visual elements.

==== Architecture in Client/Server and Client/Client Modes ====

Depending upon the language chosen for programming the model, this architecture is mapped out either across the client and server platforms, or is contained entirely in the client.

=====Java Platform=====
[[File:arch1.png||thumb||Java Architecture]]
Since Java is not native to the browser, programming the model in Java requires server-side support. We use WebSockets to facilitate communication between server and client. The illustration shows the dispatcher divided into two asynchronous units operating separately with the simulator and the presentation. The WebSocket<ref>There exist a number of tutorials on WebSockets. Here is the [https://en.wikipedia.org/wiki/WebSocket Wikipedia entry].</ref> is a robust protocol that manages communication with significant fault tolerance. This robustness translates to a highly robust execution environment for the final application.

The preceding remarks also apply to Python or other model logic coding using an appropriate server. Our experience with Java makes use of the Apache Tomcat server and the Eclipse J2EE design platform. Deploying Tomcat applications is particularly easy: the code is archived in a ".war" file and dropped into a Tomcat "webapp" directory (or, in the case of Elastic Beanstalk, uploaded to the server). Subsequent updates simply overwrite the archive. However, an external server is not needed if one installs a local Tomcat server on their computer.
 

=====JavaScript Platform=====
[[File:arch2.png||thumb||JavaScript Architecture]]
The JavaScript platform requires no special server features inasmuch as the entire application is downloaded and run in the client. In this case we maintain the same communication regimen but replace the WebSocket with a local function callback protocol. Consequently the client/server and client/client configurations offer identical structures, which facilitates Numerus' obligation for program maintenance of these platforms. Similarly, activating a local server obviates the need for an external delivery method.
 

==Model Organization==
We now provide a summary of the model algorithm for agent-based projects using the Java platform (the JS platform follows the same pattern). The code uses NetLogo terminology ''turtle'' and ''patch'', respectively, in the class names used for agent and cell base and derived classes. A main class given the name specified in the Project blueprint, oversees simulation operation. These 3 classes respectively extend <code>NLTurtle</code>, <code>NLPatch</code> and <code>NLSimMain</code>. Each turtle or patch object corresponds to a single agent or cell in the model. The main class has data structures <code>turtles</code> and <code>patches</code> to hold all of these objects. Initializing the simulation causes these data structures to be filled according to the Project DNA.

===Simulation Cycle===
In spatial and agent-based systems, turtle and patch individuals maintain local state. During a clock cycle these object compute their next state. Usually each cycle requires one or two ''visits'' to some set of turtles and/or patches, possibly all of them, asking each to compute its next state. This is generally the most computationally intensive part of the cycle. But with efficient design, there are ways to minimize the number of individuals that must be visited, knowing that their states will not change. The base classes have ways to distinguish and control which individuals the cycle must visit, thus greatly improving performance.

Each clock step of the simulation is subdivided as follows:

;Step
:The next state is computed by the following operations:
:;Coordinate
::The main program performs any preliminary action on global data, or on the turtle or patch collections.
:;Visit
::Individual patches and turtles compute their next local state.
;Shift
:The next state becomes the current state, and the clock is advanced.
:;Visit
::Shifting may require a second visit pass.
;Update
: Any required cleanup is performed. State data is sent to the browser.

===Stores===
States are represented using the <code>Store</code> class, a generic class which can hold any data type. Newly computed states are assigned to the store's <code>next</code> property. If a store is registered with the main program, the main program will perform the shift from next to current during the '''Shift''' cycle. Turtles and patches have registered stores for properties such as color, size, location, speed, and direction. Additional application-specific stores can be declared and registered. If shifting the store value from next to current is all is required, (and it usually is), a second visit during the shift cycle can be avoided.

===Stocks===
A special type of store, called a <code>Stock</code>, is used in system dynamics (SD) settings to model continuous functions. NuWebKit stocks operate like those in well-known system dynamics modeling platforms, such as Stella, Vensim and Berkeley Madonna, using RK4 integration to maintain accuracy. Stocks may be used in a purely SD model, or may be part of the environment modeled in a spatial or agent-based model.

===VisitMode===
Control of the visit schedule is specified with the VisitMode parameter, in particular the order in which visits to turtles and stocks occurs. As an exception that proves the rule, it may be advantageous to visit turtles before patches, or patches before turtles, and use the newly computed ''next'' values in, say, patches when computing the next state of the turtles, or visa versa. The VisitMode values currently supported are: 
:'''A_C''': turtles before patches
:'''C_A''': patches before turtles
:'''A''': turtles only
:'''C''': patches only
:'''No''': no visits
:'''SD''': system dynamics using Euler method integration (no visits)
:'''SDRK4''': system dynamics using Runge-Kutta<ref>See [https://en.wikipedia.org/wiki/Runge%E2%80%93Kutta_methods Runge-Kutta in the Wikipedia]</ref> 4 integration (no visits).
Additional VisitModes may be added as this platform develops.

==Directory Structures==
===Java Platform===
[[File:dir0.png||thumb|Java Eclipse Project Directory Structure]]
[[File:jssite2.png||thumb|JavaScript Presentation API Directory Structure]]

The picture shows the directory structure used by the Java platform, created as a dynamic web project for deployment on Tomcat, by EclipseEE. The project name (<code>WX</code>) acts as a group id for a set of related simulation applications. Each application specifies a name in its Project DNA. These directories are constructed by the Project Manager app using the Project blueprint file, and the code templates generated during project initialization use the name to prefix the names of the Java and JS model logic classes. The model logic code for each application is thus contained in the java directory subdirectory corresponding to that name. The classes created by the Project Manager are generally sufficient for models with a level of complexity comparable to NetLogo, and in any case serve as the root of the computational environment. The opportunity exists, however, to create more complex simulations by extending the code base with additional classes and/or dependencies.

Similarly named subdirectories of <code>webapp</code> each contain the HTML code for the application and have the identical structure shown below.

<gallery>
File:jsite.png|left|Java Model Code Directory
File:jsite1.png|left|Java HTML and Presentation Directories
File:javapresent.png|thumb|left|Java Presentation and Dispatch Structures
</gallery>

These images respectively show the contents of the model code directory (subdirectory of <code>java</code>) and the HTML/presentation directories (subdirectory of <code>webapp</code>).

Three of the HTML files are automatically generated by the Project Manager app from data contained in the Project blueprint file, using the project name as prefix. These files constitute the HTML loaded into the browser. The fourth (<code>riverDoc.html</code>) was added and appears in the documentation window of the side panel.

The <code>js</code> subdirectory contains the Project DNA file itself (i.e., <code>river.js</code>). These files are generally complete when deployed.

The right-most image shows the JavaScript, CSS and image files used to implement the Presentation and Dispatch elements of the application, as subdirectories of the <code>common</code> directory. Most of the heavy lifting is done by <code>main.js</code>, which contains the drivers for the dispatcher, input and visualization components. Code for particular components (e.g., <code>lchart.js</code> for linechart, etc.) are contained in their respective files. Consequently, new "widgets" in later releases are easily added to the API.

===JavaScript Platform===
[[File:jssite.png|thumb|left|JavaScript Application Directory Structure]]
The JavaScript platform is simpler since it does not have a <code>java</code> directory. The <code>common</code> directory is extended to include the JS model API, along with the same files used for Java Presentation support, with a small change to substitute callbacks for WebSocket interactions.

Looking at the JS application directory, we see the same 3 HTML files, but now the js subdirectory contains additional files implementing model logic. Note here that the Project DNA file is labeled <code>river.prj</code>, so that <code>river.js</code> can be used for the model logic main class. It is worth noting once again that the Project Manager creates these files under the guidance of the Project blueprint file, and they generally need not concern the model author.
 

==Project File Contents==
[[File:projectdna.png|thumb]]
We now provide a brief overview of the Project blueprint file. Contents will vary depending on the specific needs of the simulation application. Designers will benefit from existing Project blueprint files when building JSON structures for their applications. The following descriptions refer to the sample Project blueprint file shown at here.

Complete documentation for constructing a blueprint file will be presented in the user manual currently under development.

Note that, as this file presents a JSON structure, the order of the entries is immaterial.

===Lines 1 - 9: Title, Directories and Frame Size===
;Lines 2-3, Name, Title
:The '''Name''' was mentioned in the discussion on directory structure, and is used as a prefix in the class names of model logic files generated by the Project Manager. The '''Title''' is the title of the HTML main frame and appears at the top of the browser page.
;Lines 4-7, Directory Specifications
:The '''jroot''' and '''jbase''' entries identify the project's Java directories. The former points to the root directory of the Eclipse workspace, while the latter identifies the Eclipse project (and group id) for the group of project this one will be part of.
:Analogously, '''jsroot''' and '''jsbase''' identify the directories associated with JS. Since the Tomcat server is not required, these should be, respectively, the user's '''localhost''' root directory. <ref>On Mac systems this is <code>~/Sites</code>. See [https://discussions.apple.com/docs/DOC-3083 Setting up a local web server on Mac]</ref>, and a group id identifying a subdirectory for the group.
:The Project Manager uses these entries to construct directories, HTML files and model logic templates.
;Lines 8-9, Width and Height Specifications
:These specify the size of the main frame in the browser. They can be adjusted as need as the application takes shape.
;Line 10, VisitMode
:This is used by the model API to configure the main loop of the program. It will be discussed in detail later.

===Lines 11-17, Cell Specifications===
These configure the cell matrix of a spatial or agent-based model.
;Line 12, cellSize
:'''cellSize''' indicates the number of pixels used by each cell in the display. In the coordinate system of the cell matrix each cell occupies a 1 by 1 square. CellSize maps that to specific spatial coordinates on the screen, making it easy to re-scale the visual display.
;Line 13, palette
:The '''palette''' is a list of CSS colors using the "#xxxxxxyy" or any other acceptable CSS format.<ref>The hex format should be used if color blending is to take place.</ref> All cell color references are references to this palette.
;Lines 14-15, rowDim, colDim
:Row and column dimensions define the operational space of the model. Using '''rowDim''' and '''colDim''' and '''cellSize''', you can compute the size of the real estate occupied by display.
;Line 16, initial cell color
:The default assumption for cell color is palette entry 0. Any initial cell color other than 0 are specified by this array. Since the array will be transmitted via the WebSocket (in the Java platform), it is flattened. Every 3 entries indicate 1 cell (e.g., "64, 63 1" means that the cell at coordinates (64, 63) is to be colored with the second palette entry, <code>#ffffff</code>, or white.

===Lines 18-34, Agent Specifications===
A similar section is devoted to specifying agent properties. The palette entry is analogous to that used by cell specifications. Defaults are provided for the 5 fundamental agent properties (<code>color, size, shape, speed, theta<ref>a ''null'' value for theta means a random assignment</ref></code>). <code>count</code> determines the initial agent count. It can either be a number or the code of an input whose value will be used. <code>start</code> can be a list of agents with initial configurations, or the string "random", indicating random assignment of properties to <code>count</code> agents. Other properties defined in this section will be discussed in a subsequent document.

===Lines 36-48, Displays===
This entry consists of an array of display specifications for graphs, tables, spys<ref>Recall a ''spy'' is a component showing a single data point. Spys show up on the page at the top of the display area</ref>, etc. Each display includes a 3-letter "airport code" that identifies the display. Other parameters depend on the type of display. The ''site'' property point to 1 of 6 slots reserved on the Web page for locating the display (If more that 6 displays are required the programmer can modify the HTML file accommodate them). Shown here is a linechart with the indicated domain and range.

===Lines 49-51, Inputs ===
This is an array of slider or other input specifications, also using airport codes to identify them (note that this slider's airport code corresponds to the code used by the count property in the agent section.) The array containing the inputs may be multi-dimensional, creating a multi-row layout on the page.

== Sample Workflow ==
Here is an outline of workflow for a project called "MyProject" using the Project Manager and developed on the Java platform using Eclipse J2EE (now called Jakarta) and Tomcat.

# Install Eclipse Jakarta, open a workspace and create a Dynamic Web project.
# In a separate directory open '''myproject.prj''' in a text editor (emacs, vi, etc.)
# Edit '''myproject.prj''' to include a project blueprint containing the desired features and parameters. Be sure to reference to appropriate directories in the Eclipse workspace.
# Launch the Project Manager app and load '''myproject.prj'''; correct any errors and save the corrected version.
# Use the Project Manager to construct directories and template files in the Eclipse Workspace.
# Launch Tomcat from Eclipse.
# Navigate to the project in Chrome or a Web browser of your choice. A fully-featured Web page should appear.
# Connect and run the model; the timers will show that the model is running, but no changes occur in the display since the model logic has not yet been programmed.
# View the project DNA file, contained in '''js/myproject.js''', in Eclipse. Make any desired cosmetic changes to the size and appearance of the components by altering the project DNA file and reloading the page. When you are satisfied, use the Project Manager to update the blueprint with the current contents of the project DNA file.
# Define the model logic in the Java files '''MyProject.java''', '''MyProjectTurtle.java''' and '''MyProjectPatch.java'''. The Tomcat server will reload with every saved change. Occasionally the Tomcat server is unable to keep up and will offer to terminate or restart. You may want to terminate the Tomcat server while writing code to avoid this interruption. Restarting the Tomcat server and reloading the Web page will refresh the presentation.
# You may also want to open the browser's DevTools to monitor Web page execution.

==Glossary of Terms==
;simulation
:a system that maintains a global state that evolves over time.
;simulator
:a computational structure for executing a simulation
;clock
:issues a sequence of signals to a simulation to cause it to change state.
;presentation
:A Web page displaying data and controls for a simulation program.
;dispatcher
:expedites communication between presentation, clock and simulator.
;system dynamics
:an approach to understanding the nonlinear behaviour of complex systems over time using stocks, flows, internal feedback loops, table functions and time delays.
;spatial model
:a particular form of disaggregation, in which an area is divided into a number (often a large number) of similar units: typically grid squares or polygons (also called cells).
;agent- (or individual- ) based model
:a computational model for simulating the actions and interactions of autonomous agents (both individual or collective entities such as organizations or groups) in order to understand the behavior of a system and what governs its outcomes.
;turtle
:NetLogo terminology for agent.
;patch
:NetLogo terminology for cell.
;network
:as used here, an alternative to the patch topology in which agents reside in nodes and travel along connections between nodes.
;SimWorld
:A visual Web page component showing the cells and agents of the model.
;display
:graphs, tables, etc. shown in the Web page.
;JSON (JavaScript Object Notation)
:a format for storing and exchanging data that's readable by both humans and machines.
;project "DNA"
:a file containing a JSON definition for defining and parameterizing a simulation project.
;project blueprint
:a JSON file constructed by the application developer for use as Project DNA
;Project Manager
:a Numerus application that reads the project blueprint and creates or updates the project's Website.
;step
:a phase of the simulator cycle during which new state values are computed
;shift
:a phase of the simulator cycle during which the new state becomes the current state
;Store
:a data structure used by the simulator to hold the current and next state.
;Stock
:an extension of the Store data type for system dynamics, capable of modeling continuous functions.
;VisitMode
:a parameter that determines the behavior of the simulator during each cycle.
;Eclipse
:a free, Java-based development platform known for its plugins that allow developers to develop and test code written in Java and other programming languages.
;Apache Tomcat
:a free, lightweight web server and servlet container that's used to run Java-based web applications.
;D3
:the JavaScript library for ''bespoke'' (their description) data visualization.
;palette
:a list of color specifications for display purposes.
;side panel
:an area of the NuWebKit Web page containing documentation and other features.
<hr>

Numerus WebKit

2026-03-19T16:55:11Z

Rsalter: Rsalter moved page Numerus WebKit to NuWebKit: Change of app name

#REDIRECT [[NuWebKit]]

NuWebKit

2026-03-19T16:55:11Z

Rsalter: Rsalter moved page Numerus WebKit to NuWebKit: Change of app name

Numerus WebKit (NuWebKit) is a technology for building powerful simulations that run in a Web browser. It consists of applications and APIs that support the design of models along the lines of NetLogo (NL), but using conventional languages such as Java, JavaScript (JS) and Python.<ref>This API is under development.</ref> These applications are deployed either from a remote server, such as Amazon Web Services (AWS) Elastic Beanstalk (AWSEB), (or, in Java mode, any other server that supports WebSockets, or in JS mode, from any conventional Web or Cloud server); alternatively, they can be run locally without using any network connectivity using a ''localhost'' server. JS development only requires text editing, and Java development can take advantage of the Eclipse J2EE (Jakarta) platform using the Apache Tomcat server.

NuWebKit uses the D3 JavaScript library for rendering high quality dynamic visualizations.

This document describes the NuWebKit architecture, APIs and applications. Tutorials, documents describing example models, and a complete user manual, are forthcoming. Click [[WebKit Examples|here]] to access NuWebKit examples.

== NuWebKit Concepts ==
A simulation program is a system that maintains a global state that evolves over time. A simulation is starts in some initial state, and incurs state changes following successive strobes from an external source (which we call the '''clock'''). The state may consist of a single data value or multiple data values mapped out over the internal structure of the simulation. An example of the former is a simple simulation of exponential growth, where the current population is the only value of interest. The latter is exemplified by a spatial or agent based model where simulation state is distributed over individual agents or cells. At each time step the state change algorithm determines the new state from the current and possibly past states of the system. As the simulation runs, the user is presented with displays that illustrate the simulation's state. Time in a simulation is measured in clock ticks which may be mapped to model-time values. A simulation may run for a fixed interval, or may operate in an unbounded time frame.

A ''spatial'' simulation models a domain of cells or network nodes organized topologically as a tesselation of 2- or 3-dimensional space, in a Cartesian, or, possibly, hexagonal lattice. Cells have a fixed location and one intrinsically allocated state value, a real number which is associated with a color.

In an agent-, or individual-based model, agents exist in the space defined by the spatial topology and are mobile. In addition to location, their intrinsic state values include color and size. Optionally, speed and direction ("theta"<ref>"phi" values are also intrinsic for 3-d models</ref>) values can be assigned that direct movement. We use the term ''SimWorld'' to refer to the combined cell/agent universe.

The NuWebKit platform uses a Web browser to create a ''presentation'' of the simulation to the user. The presentation is separate from the model logic that determines the state evolution of the program, even when both are running on the client. When client and server are both used to execute a simulation, a WebSocket facilitates communication between the presentation and model logic. Consequently, the user must first connect the presentation to the model logic. This step is maintained even for client-side-only deployment, for the sake of uniformity. Disconnecting and reconnecting is a simple and reliable way of restarting a session.

To assist with model creation NuWebKit provides a '''Project Manager''' application. Using this, the programmer creates a Project '''blueprint''', essentially a file containing the Project DNA, stored separately from the project directories. The Project Manager reads this file and first parses the JSON contained in the blueprint to weed out any errors. Once a blueprint is correct, the Project Manager creates directory structures for the project, adds the project DNA file constructed from the blueprint, and inserts runnable but empty Java or JS source files for the model logic. As the project develops, changes may be made to the actual project DNA to fine tune the application. The Project Manager also has a function for retrieving deployed Project DNA files and correcting the blueprint, so that using the workflow recommended in a later section, the blueprint will always be current.

We next explore simulation programs from the point of view of the user, and then discuss how these programs are organized architecturally and in terms of their model logic.

=== User Experience ===
[[File:app.png|thumb|NuWebKit User Interface]]
This image shows the browser window running the sample agent-based application "Rock Paper Scissors", with the following features:
;Model Inputs
:These sliders set parameters for the simulation. Changes are forwarded even while the simulation is running and my have immediate effect.
;Timers
:These windows show the current model time. The left window counts up from 0. If the simulation is designed to run for a fixed time period, the right timer window will be initialized to that time and will count down.
;Operating Buttons
:The '''Connect/Disconnect''' buttons activate/deactivate the WebSocket, with the '''Connect''' button initializing the application. (Note that this functionality is maintained in the JS platform for the sake of uniformity.) Disconnecting and Connecting is one way to restart the application; reloading the page is another.
:The '''Reset''', '''Step''' and '''Start/Stop''' buttons operate the simulation. '''Step''' executes a single time step, '''Start/Stop''' bring about continuous operation, and '''Reset''' restores the initial state and resets the timers. Double-clicking '''Reset''' also reinitializes the application.
[[File:browser.png|thumb|Web Page With Side Panel Displayed]]
;Speed Control
:This determines the real-time interval between steps.
;Displays
:A spatial or agent-based simulation will include a "SimWorld" display that uses graphic cues to show the current state of the model. Among these cues are location and color, for both cells and agents, and, additionally, size and shape for agents.
:Other displays such as Spys (showing a single current value) graphs, tables, etc. are specified in the Project file (see below).
;Side Panel
:The browser page has a side panel. Use [[File:sideicon.png]] to toggle visibility (you may have to make the browswer wider to see the panel). Currently this side panel contains model documentation and a log window for WebSocket status reports. A dashboard for altering some properties of the displays, such as the dimensions of the SimWorld, is forthcoming.

=== System Architecture ===
[[File:arch0.png|thumb||Basic Architecture]]
NuWebKit architecture revolves around 5 major structures. Refer to the diagram on the right to understand the organization of these items.
;Project
:The ''Project'' (or Project "DNA"), is a JSON<ref>JSON (JavaScript Object Notation) is a standard format for storing and exchanging data. It's a lightweight, text-based format that's easy to read by humans and machines.</ref> object contained in a text file, specifying the parameters that configure the elements of both the simulation and the presentation. Details will be given below. If the Project Manager is used to initialize a a project, the programmer first creates a '''blueprint''', essentially the Project DNA file in a separate directory. As mentioned above, the Project Manager uses the blueprint to create a new runnable (but semantically empty) project.

;Presentation
:The ''Presentation'' supports visualization and user inputs in the browser. This structure is usually constructed directly in the Presentation API from the data contained in the Project JSON object. All elements of the project pertaining to the visualization and input portal required by the project. These include the agent/cell display (the "SimWorld" display), graphs, tables, etc. Specifications for this aspect are almost always covered by the contents of the Project file and require no attention from the model programmer.<ref>There are exceptions. One will be presented in a subsequent example.</ref>
;Simulator
:The ''Simulation'' structure, which contains the "business logic" for the model. This consists of 2 parts: the simulation API, which defines the data structures and methods used in the model, and the model itself. The simulation API supports the "turtle/patch" abstraction for agent-based models (ABMs), familiar from NL, but contains some additional capabilities, such as a network basis that substitutes for the patch abstraction, and support for system dynamics models using stocks and flows that can integrate with the ABMs. The simulation API is also configured directly by the Project DNA structure. Model designers can focus entirely on the model structure. One crucial property that we will insist be maintained is that changes to all parts of state occur simultaneously. In other words, any algorithm used to determine one part of a new state only relies on the current or past state of itself and any other part of the state, so that the order in which different parts of the state are computed is immaterial to the outcome.
;Clock
:''Clock'' refers to an external module that provides signals or ''strobes'' to the simulation for it to update its state. The clock is controlled from the user console in the browser and can be programmed so that the interval between strobes represents a particular interval of model time (called ''dt'').
;Dispatcher
:This unit facilitates communication between presentation and simulation elements of the application. When a project is loaded into the browser and communication is established, the dispatcher initializes a new simulator with its required parameters. The dispatcher communicates control signals from the presentation to operate the simulator, and any parameter changes that result from user gestures on sliders, switches or other input components. In response, the simulator uses the dispatcher to forward data (called a ''status report'') to the presentation that it needs to update its visual elements.

==== Architecture in Client/Server and Client/Client Modes ====

Depending upon the language chosen for programming the model, this architecture is mapped out either across the client and server platforms, or is contained entirely in the client.

=====Java Platform=====
[[File:arch1.png||thumb||Java Architecture]]
Since Java is not native to the browser, programming the model in Java requires server-side support. We use WebSockets to facilitate communication between server and client. The illustration shows the dispatcher divided into two asynchronous units operating separately with the simulator and the presentation. The WebSocket<ref>There exist a number of tutorials on WebSockets. Here is the [https://en.wikipedia.org/wiki/WebSocket Wikipedia entry].</ref> is a robust protocol that manages communication with significant fault tolerance. This robustness translates to a highly robust execution environment for the final application.

The preceding remarks also apply to Python or other model logic coding using an appropriate server. Our experience with Java makes use of the Apache Tomcat server and the Eclipse J2EE design platform. Deploying Tomcat applications is particularly easy: the code is archived in a ".war" file and dropped into a Tomcat "webapp" directory (or, in the case of Elastic Beanstalk, uploaded to the server). Subsequent updates simply overwrite the archive. However, an external server is not needed if one installs a local Tomcat server on their computer.
 

=====JavaScript Platform=====
[[File:arch2.png||thumb||JavaScript Architecture]]
The JavaScript platform requires no special server features inasmuch as the entire application is downloaded and run in the client. In this case we maintain the same communication regimen but replace the WebSocket with a local function callback protocol. Consequently the client/server and client/client configurations offer identical structures, which facilitates Numerus' obligation for program maintenance of these platforms. Similarly, activating a local server obviates the need for an external delivery method.
 

==Model Organization==
We now provide a summary of the model algorithm for agent-based projects using the Java platform (the JS platform follows the same pattern). The code uses NetLogo terminology ''turtle'' and ''patch'', respectively, in the class names used for agent and cell base and derived classes. A main class given the name specified in the Project blueprint, oversees simulation operation. These 3 classes respectively extend <code>NLTurtle</code>, <code>NLPatch</code> and <code>NLSimMain</code>. Each turtle or patch object corresponds to a single agent or cell in the model. The main class has data structures <code>turtles</code> and <code>patches</code> to hold all of these objects. Initializing the simulation causes these data structures to be filled according to the Project DNA.

===Simulation Cycle===
In spatial and agent-based systems, turtle and patch individuals maintain local state. During a clock cycle these object compute their next state. Usually each cycle requires one or two ''visits'' to some set of turtles and/or patches, possibly all of them, asking each to compute its next state. This is generally the most computationally intensive part of the cycle. But with efficient design, there are ways to minimize the number of individuals that must be visited, knowing that their states will not change. The base classes have ways to distinguish and control which individuals the cycle must visit, thus greatly improving performance.

Each clock step of the simulation is subdivided as follows:

;Step
:The next state is computed by the following operations:
:;Coordinate
::The main program performs any preliminary action on global data, or on the turtle or patch collections.
:;Visit
::Individual patches and turtles compute their next local state.
;Shift
:The next state becomes the current state, and the clock is advanced.
:;Visit
::Shifting may require a second visit pass.
;Update
: Any required cleanup is performed. State data is sent to the browser.

===Stores===
States are represented using the <code>Store</code> class, a generic class which can hold any data type. Newly computed states are assigned to the store's <code>next</code> property. If a store is registered with the main program, the main program will perform the shift from next to current during the '''Shift''' cycle. Turtles and patches have registered stores for properties such as color, size, location, speed, and direction. Additional application-specific stores can be declared and registered. If shifting the store value from next to current is all is required, (and it usually is), a second visit during the shift cycle can be avoided.

===Stocks===
A special type of store, called a <code>Stock</code>, is used in system dynamics (SD) settings to model continuous functions. NuWebKit stocks operate like those in well-known system dynamics modeling platforms, such as Stella, Vensim and Berkeley Madonna, using RK4 integration to maintain accuracy. Stocks may be used in a purely SD model, or may be part of the environment modeled in a spatial or agent-based model.

===VisitMode===
Control of the visit schedule is specified with the VisitMode parameter, in particular the order in which visits to turtles and stocks occurs. As an exception that proves the rule, it may be advantageous to visit turtles before patches, or patches before turtles, and use the newly computed ''next'' values in, say, patches when computing the next state of the turtles, or visa versa. The VisitMode values currently supported are: 
:'''A_C''': turtles before patches
:'''C_A''': patches before turtles
:'''A''': turtles only
:'''C''': patches only
:'''No''': no visits
:'''SD''': system dynamics using Euler method integration (no visits)
:'''SDRK4''': system dynamics using Runge-Kutta<ref>See [https://en.wikipedia.org/wiki/Runge%E2%80%93Kutta_methods Runge-Kutta in the Wikipedia]</ref> 4 integration (no visits).
Additional VisitModes may be added as this platform develops.

==Directory Structures==
===Java Platform===
[[File:dir0.png||thumb|Java Eclipse Project Directory Structure]]
[[File:jssite2.png||thumb|JavaScript Presentation API Directory Structure]]

The picture shows the directory structure used by the Java platform, created as a dynamic web project for deployment on Tomcat, by EclipseEE. The project name (<code>WX</code>) acts as a group id for a set of related simulation applications. Each application specifies a name in its Project DNA. These directories are constructed by the Project Manager app using the Project blueprint file, and the code templates generated during project initialization use the name to prefix the names of the Java and JS model logic classes. The model logic code for each application is thus contained in the java directory subdirectory corresponding to that name. The classes created by the Project Manager are generally sufficient for models with a level of complexity comparable to NetLogo, and in any case serve as the root of the computational environment. The opportunity exists, however, to create more complex simulations by extending the code base with additional classes and/or dependencies.

Similarly named subdirectories of <code>webapp</code> each contain the HTML code for the application and have the identical structure shown below.

<gallery>
File:jsite.png|left|Java Model Code Directory
File:jsite1.png|left|Java HTML and Presentation Directories
File:javapresent.png|thumb|left|Java Presentation and Dispatch Structures
</gallery>

These images respectively show the contents of the model code directory (subdirectory of <code>java</code>) and the HTML/presentation directories (subdirectory of <code>webapp</code>).

Three of the HTML files are automatically generated by the Project Manager app from data contained in the Project blueprint file, using the project name as prefix. These files constitute the HTML loaded into the browser. The fourth (<code>riverDoc.html</code>) was added and appears in the documentation window of the side panel.

The <code>js</code> subdirectory contains the Project DNA file itself (i.e., <code>river.js</code>). These files are generally complete when deployed.

The right-most image shows the JavaScript, CSS and image files used to implement the Presentation and Dispatch elements of the application, as subdirectories of the <code>common</code> directory. Most of the heavy lifting is done by <code>main.js</code>, which contains the drivers for the dispatcher, input and visualization components. Code for particular components (e.g., <code>lchart.js</code> for linechart, etc.) are contained in their respective files. Consequently, new "widgets" in later releases are easily added to the API.

===JavaScript Platform===
[[File:jssite.png|thumb|left|JavaScript Application Directory Structure]]
The JavaScript platform is simpler since it does not have a <code>java</code> directory. The <code>common</code> directory is extended to include the JS model API, along with the same files used for Java Presentation support, with a small change to substitute callbacks for WebSocket interactions.

Looking at the JS application directory, we see the same 3 HTML files, but now the js subdirectory contains additional files implementing model logic. Note here that the Project DNA file is labeled <code>river.prj</code>, so that <code>river.js</code> can be used for the model logic main class. It is worth noting once again that the Project Manager creates these files under the guidance of the Project blueprint file, and they generally need not concern the model author.
 

==Project File Contents==
[[File:projectdna.png|thumb]]
We now provide a brief overview of the Project blueprint file. Contents will vary depending on the specific needs of the simulation application. Designers will benefit from existing Project blueprint files when building JSON structures for their applications. The following descriptions refer to the sample Project blueprint file shown at here.

Complete documentation for constructing a blueprint file will be presented in the user manual currently under development.

Note that, as this file presents a JSON structure, the order of the entries is immaterial.

===Lines 1 - 9: Title, Directories and Frame Size===
;Lines 2-3, Name, Title
:The '''Name''' was mentioned in the discussion on directory structure, and is used as a prefix in the class names of model logic files generated by the Project Manager. The '''Title''' is the title of the HTML main frame and appears at the top of the browser page.
;Lines 4-7, Directory Specifications
:The '''jroot''' and '''jbase''' entries identify the project's Java directories. The former points to the root directory of the Eclipse workspace, while the latter identifies the Eclipse project (and group id) for the group of project this one will be part of.
:Analogously, '''jsroot''' and '''jsbase''' identify the directories associated with JS. Since the Tomcat server is not required, these should be, respectively, the user's '''localhost''' root directory. <ref>On Mac systems this is <code>~/Sites</code>. See [https://discussions.apple.com/docs/DOC-3083 Setting up a local web server on Mac]</ref>, and a group id identifying a subdirectory for the group.
:The Project Manager uses these entries to construct directories, HTML files and model logic templates.
;Lines 8-9, Width and Height Specifications
:These specify the size of the main frame in the browser. They can be adjusted as need as the application takes shape.
;Line 10, VisitMode
:This is used by the model API to configure the main loop of the program. It will be discussed in detail later.

===Lines 11-17, Cell Specifications===
These configure the cell matrix of a spatial or agent-based model.
;Line 12, cellSize
:'''cellSize''' indicates the number of pixels used by each cell in the display. In the coordinate system of the cell matrix each cell occupies a 1 by 1 square. CellSize maps that to specific spatial coordinates on the screen, making it easy to re-scale the visual display.
;Line 13, palette
:The '''palette''' is a list of CSS colors using the "#xxxxxxyy" or any other acceptable CSS format.<ref>The hex format should be used if color blending is to take place.</ref> All cell color references are references to this palette.
;Lines 14-15, rowDim, colDim
:Row and column dimensions define the operational space of the model. Using '''rowDim''' and '''colDim''' and '''cellSize''', you can compute the size of the real estate occupied by display.
;Line 16, initial cell color
:The default assumption for cell color is palette entry 0. Any initial cell color other than 0 are specified by this array. Since the array will be transmitted via the WebSocket (in the Java platform), it is flattened. Every 3 entries indicate 1 cell (e.g., "64, 63 1" means that the cell at coordinates (64, 63) is to be colored with the second palette entry, <code>#ffffff</code>, or white.

===Lines 18-34, Agent Specifications===
A similar section is devoted to specifying agent properties. The palette entry is analogous to that used by cell specifications. Defaults are provided for the 5 fundamental agent properties (<code>color, size, shape, speed, theta<ref>a ''null'' value for theta means a random assignment</ref></code>). <code>count</code> determines the initial agent count. It can either be a number or the code of an input whose value will be used. <code>start</code> can be a list of agents with initial configurations, or the string "random", indicating random assignment of properties to <code>count</code> agents. Other properties defined in this section will be discussed in a subsequent document.

===Lines 36-48, Displays===
This entry consists of an array of display specifications for graphs, tables, spys<ref>Recall a ''spy'' is a component showing a single data point. Spys show up on the page at the top of the display area</ref>, etc. Each display includes a 3-letter "airport code" that identifies the display. Other parameters depend on the type of display. The ''site'' property point to 1 of 6 slots reserved on the Web page for locating the display (If more that 6 displays are required the programmer can modify the HTML file accommodate them). Shown here is a linechart with the indicated domain and range.

===Lines 49-51, Inputs ===
This is an array of slider or other input specifications, also using airport codes to identify them (note that this slider's airport code corresponds to the code used by the count property in the agent section.) The array containing the inputs may be multi-dimensional, creating a multi-row layout on the page.

== Sample Workflow ==
Here is an outline of workflow for a project called "MyProject" using the Project Manager and developed on the Java platform using Eclipse J2EE (now called Jakarta) and Tomcat.

# Install Eclipse Jakarta, open a workspace and create a Dynamic Web project.
# In a separate directory open '''myproject.prj''' in a text editor (emacs, vi, etc.)
# Edit '''myproject.prj''' to include a project blueprint containing the desired features and parameters. Be sure to reference to appropriate directories in the Eclipse workspace.
# Launch the Project Manager app and load '''myproject.prj'''; correct any errors and save the corrected version.
# Use the Project Manager to construct directories and template files in the Eclipse Workspace.
# Launch Tomcat from Eclipse.
# Navigate to the project in Chrome or a Web browser of your choice. A fully-featured Web page should appear.
# Connect and run the model; the timers will show that the model is running, but no changes occur in the display since the model logic has not yet been programmed.
# View the project DNA file, contained in '''js/myproject.js''', in Eclipse. Make any desired cosmetic changes to the size and appearance of the components by altering the project DNA file and reloading the page. When you are satisfied, use the Project Manager to update the blueprint with the current contents of the project DNA file.
# Define the model logic in the Java files '''MyProject.java''', '''MyProjectTurtle.java''' and '''MyProjectPatch.java'''. The Tomcat server will reload with every saved change. Occasionally the Tomcat server is unable to keep up and will offer to terminate or restart. You may want to terminate the Tomcat server while writing code to avoid this interruption. Restarting the Tomcat server and reloading the Web page will refresh the presentation.
# You may also want to open the browser's DevTools to monitor Web page execution.

==Glossary of Terms==
;simulation
:a system that maintains a global state that evolves over time.
;simulator
:a computational structure for executing a simulation
;clock
:issues a sequence of signals to a simulation to cause it to change state.
;presentation
:A Web page displaying data and controls for a simulation program.
;dispatcher
:expedites communication between presentation, clock and simulator.
;system dynamics
:an approach to understanding the nonlinear behaviour of complex systems over time using stocks, flows, internal feedback loops, table functions and time delays.
;spatial model
:a particular form of disaggregation, in which an area is divided into a number (often a large number) of similar units: typically grid squares or polygons (also called cells).
;agent- (or individual- ) based model
:a computational model for simulating the actions and interactions of autonomous agents (both individual or collective entities such as organizations or groups) in order to understand the behavior of a system and what governs its outcomes.
;turtle
:NetLogo terminology for agent.
;patch
:NetLogo terminology for cell.
;network
:as used here, an alternative to the patch topology in which agents reside in nodes and travel along connections between nodes.
;SimWorld
:A visual Web page component showing the cells and agents of the model.
;display
:graphs, tables, etc. shown in the Web page.
;JSON (JavaScript Object Notation)
:a format for storing and exchanging data that's readable by both humans and machines.
;project "DNA"
:a file containing a JSON definition for defining and parameterizing a simulation project.
;project blueprint
:a JSON file constructed by the application developer for use as Project DNA
;Project Manager
:a Numerus application that reads the project blueprint and creates or updates the project's Website.
;step
:a phase of the simulator cycle during which new state values are computed
;shift
:a phase of the simulator cycle during which the new state becomes the current state
;Store
:a data structure used by the simulator to hold the current and next state.
;Stock
:an extension of the Store data type for system dynamics, capable of modeling continuous functions.
;VisitMode
:a parameter that determines the behavior of the simulator during each cycle.
;Eclipse
:a free, Java-based development platform known for its plugins that allow developers to develop and test code written in Java and other programming languages.
;Apache Tomcat
:a free, lightweight web server and servlet container that's used to run Java-based web applications.
;D3
:the JavaScript library for ''bespoke'' (their description) data visualization.
;palette
:a list of color specifications for display purposes.
;side panel
:an area of the NuWebKit Web page containing documentation and other features.
<hr>

Numerus Wiki

2026-03-19T16:54:20Z

Rsalter: /* Numerus WebKit */

== Numerus Wiki Content ==
===Numerus WebKit===
'''Numerus WebKit''' (NuWebKit) is a technology for building powerful simulations that run in a Web browser. It consists of applications and APIs that support the design of models along the lines of NetLogo, but using conventional languages such as Java, JavaScript and Python. These applications are deployed either from a remote server, or run locally without using any network.
* [[Numerus WebKit | About Numerus WebKit]]
* [[Example NuWebKit Models]] (Javascript platform only)
* [[NuWebKit Examples]] (Java & Javascript platforms)
* [[NuWebKit Users Guide]]
* [[NuML Language Reference]]

===Numerus Designer/Studio and Model Builder===
* [[Example WebKit Models]]* [[Numerus Designer]]
* [[Numerus Studio]]
* [http://wiki.numerusinc.com/index.php/Numerus_Model_Builder_Wiki:_The_Place_for_NumerusMB_Documentation Numerus Model Builder]

===Numerus Downloadable / On-line Apps===
* [[SEIVAgent IBM Epidemic Simulator]]
* [[NMB DASA Covid-19 User Guide]]

WebKit Examples

2026-03-19T16:53:53Z

Rsalter: Rsalter moved page WebKit Examples to NuWebKit Examples: Change of app name

#REDIRECT [[NuWebKit Examples]]

NuWebKit Examples

2026-03-19T16:53:53Z

Rsalter: Rsalter moved page WebKit Examples to NuWebKit Examples: Change of app name

These examples illustrate a new Web-based technology for building and deploying Numerus simulations. Models are specified using a JSON project file (the model "DNA") and are built directly as Web applications. The model logic is programmed in one of two ways: 1) using Java code that runs on the server and interacts with the browser using web sockets; or 2) in Javascript that is downloaded and executed in the browser. The server-side execution model is intended for larger applications and minimal data exchange; a server-side Python API is also under development. The Javascript model executes very efficiently on the sample programs.

The distribution includes an application that sets up the directories and provides templates for the programmer.

To use, click '''Connect''' to initiate the web socket connection. This will enable the other 4 buttons: '''Disconnect''', '''Reset''', '''Step''' and '''Start'''. Use the '''Start/Stop''' button to run the program continuously. '''Step''' single-steps the program. '''Reset''' returns to the beginning. A '''Double-Reset''' reinitializes the simulation. You can also reinitialize with '''Disconnect/Connect''', or simply reloading the web page.

All of the NetLogo-based translations include the NetLogo documentation. View documentation and other important features by clicking on the side panel icon: [[File:sideicon.png]].

A user guide is currently under construction. An overview showing how Numerus WebKit works can be found [[Numerus WebKit | here]]

==Java Versions Running on AWS Elastic Beanstalk==

'''New Releases'''

;[http://wx-test.us-east-2.elasticbeanstalk.com/egol3/ Three State Extended Game of Life]
:A 3-state extended version of Conway's Game of Life (GoL). The mathematical equations behind this GoL are described in a paper that can be downloaded at [https://www.biorxiv.org/content/10.1101/2022.08.30.505937v1 mathRxiv]. Click through the 8 presets to view different starting configurations, and feel free to save your own interesting discoveries in unused presets.

;[http://wx-test.us-east-2.elasticbeanstalk.com/sirsdet/ Deterministic SIRS]
:A mass-action SIRS model described in the publication [https://doi.org/10.1101/2022.02.09.22270752 Simulation Platforms to Support Teaching and Research in Epidemiological Dynamics].

;[http://wx-test.us-east-2.elasticbeanstalk.com/sirsdtvdet/ Deterministic SIRS With Vaccinations]
:A mass-action SIRS model, with vaccinations, described in the publication [https://doi.org/10.1101/2022.02.09.22270752 Simulation Platforms to Support Teaching and Research in Epidemiological Dynamics].

;[http://wx-test.us-east-2.elasticbeanstalk.com/sirsdtvsto/ Stochastic SIRS with Vaccinations]
:A stochastic version of the previous model. See [https://doi.org/10.1101/2022.02.09.22270752 Simulation Platforms to Support Teaching and Research in Epidemiological Dynamics]

;[http://wx-test.us-east-2.elasticbeanstalk.com/sdsir SD SIR]
:A simple mass-action SIR model demonstrating the WebKit Sensitivity analysis platform.

These new examples take advantage of 2 new WebKit features: Settings Presets and RAMs (runtime configurable modules). Settings Presets are a set of "radio" buttons that can be programmed to retain and recall the current settings (Preset 0 is always the "factory" default). Presets will persist in a given browser from session to session. They can be saved for safe keeping and/or for transferring between browsers.

RAMs are significant choices in the algorithm of the model and are always documented. If a project includes one or more RAMs, radio buttons will appear at the top of the side panel (open using [[File:sideicon.png]]) to access each individual RAM. Each RAM displays a set of alternatives, some of which may require parameters. The Default RAM always represents "factory" settings.

The '''Immune to Vaccinated''' RAM in '''Deterministic SIRS w/ Vaccinations''' contains a '''User Input''' RAM selection in which users can create their own expressions using a set of parameters provided by the RAM. An example is contained in Preset 1.

The best way to use RAMs is to save the current settings in a preset, since the settings saved in a preset includes the current RAM selection and any RAM configuration parameters. Recalling that preset properly selects and initializes the desired RAM alternative.

The Extended Game of Life includes 8 interesting choices for the Initial State RAM that it supports. Use the New Preset spinner to view and run each of these.

'''More detailed documentation for Presets and RAMs is currently underway and will be available soon'''.

;[http://wx-test.us-east-2.elasticbeanstalk.com/agents/ Agents]
:Simple agent motion.

;[http://wx-test.us-east-2.elasticbeanstalk.com/antz/ Ants]
:NetLogo model. A colony of ants forages for food. Though each ant follows a set of simple rules, the colony as a whole acts in a sophisticated way.

;[http://wx-test.us-east-2.elasticbeanstalk.com/diffuse/ Diffusion]
:NetLogo diffusion example. Diffusion Graphics is unlike most other NetLogo models, in that it really doesn’t ‘model’ anything. It simply explores the power behind an interesting patch primitive: ‘diffuse’.

;[http://wx-test.us-east-2.elasticbeanstalk.com/dla/ Diffusion Limited Aggregation]
:This model demonstrates diffusion-limited aggregation, in which randomly moving (diffusing) particles stick together (aggregate) to form beautiful treelike branching fractal structures. There are many patterns found in nature that resemble the patterns produced by this model: crystals, coral, fungi, lightning, and so on

;[http://wx-test.us-east-2.elasticbeanstalk.com/exgrowth/ Exponential Growth]
:Exponential Growth.

;[http://wx-test.us-east-2.elasticbeanstalk.com/fng/ Fungal Growth]
:From Whitney's NetLogo model

;[http://wx-test.us-east-2.elasticbeanstalk.com/follower/ Follower]
:NetLogo model. In Follower, turtles attempt to “connect” with other turtles, forming long chains according to a small set of simple rules.

;[http://wx-test.us-east-2.elasticbeanstalk.com/forest/ Forest]
:Forest fire model.

;[http://wx-test.us-east-2.elasticbeanstalk.com/fworks/ Fire Works]
:NetLogo model. This program models the action of fireworks. Rockets begin at the bottom of the view, shoot upwards into the sky and then explode, emitting showers of falling sparks. Works best at lower speed.

;[http://wx-test.us-east-2.elasticbeanstalk.com/life/ Life]
:Conway's Game of Life. Enough said.

;[http://wx-test.us-east-2.elasticbeanstalk.com/lifeagents/ Life Agents]
:Game of Life with agent motion. An agent passing over a live cell colors the cell with the agent's color.

;[http://wx-test.us-east-2.elasticbeanstalk.com/lotka/ Lotka-Volterra Model]
:Shows both time and phase graphs.

;[http://wx-test.us-east-2.elasticbeanstalk.com/mongoose/ Mongoose]
:Current version of mongoose simulation.

;[http://wx-test.us-east-2.elasticbeanstalk.com/river/ Meandering River]
:Netlogo Model. This model demonstrates the meandering of a river along its “middle course”, where the gradient of the landscape is gradual and the river runs within a U-shaped river valley. The evolution of the shape of the river is governed by the path of its highest-velocity flow, as well as erosion and deposition.
:This example has documentation extracted from the Netlogo version. Click the icon on the top-right of the page.

[http://wx-test.us-east-2.elasticbeanstalk.com/rps/ Rock Paper Scissors]
:NetLogo Model. This model explores the role of movement and space in a three species ecosystem. The system consists of three species, represented by red patches, green patches, and blue patches, which compete over space. The interactions between the species are based on the game Rock-Paper-Scissors. That is, red beats green, green beats blue, and blue beats red. Organisms compete with their neighbors, move throughout the environment, and reproduce. These interactions result in spiral patterns whose size and stability depends on the movement rate of the organisms.

;[http://wx-test.us-east-2.elasticbeanstalk.com/wolfsheep/ Wolf Sheep Predation]
:NetLogo Model. A population of sheep that wander around the landscape. For each step the sheep take it costs them some energy and if there energy gets too low they die. However, the sheep can eat grass in the environment to regain energy and the grass regrows over time. If the energy of the sheep gets above a certain level then they can reproduce. There are also wolves that have the same behaviors as sheep except for eating; rather than grass, they eat sheep.

;[http://wx-test.us-east-2.elasticbeanstalk.com/wvmach/ Wave Machine]
:Netlogo Model. This model simulates wave motion in a membrane. The four edges of the membrane are fixed to a frame. A green rectangular area represents a driver plate that moves up and down, exhibiting sinusoidal motion.

==Javascript Versions Running in Client Browser==

'''New Releases'''

;[https://www.cs.oberlin.edu/~rms/wk/egol3/index.html Three State Extended Game of Life]
:A 3-state extended version of Conway's Game of Life (GoL). The mathematical equations behind this GoL are described in a paper that can be downloaded at [https://www.biorxiv.org/content/10.1101/2022.08.30.505937v1 mathRxiv]. Click through the 8 presets to view different starting configurations, and feel free to save your own interesting discoveries in unused presets.

;[https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sirsdet/index.html Deterministic SIRS]
:A mass-action SIRS model described in the publication [https://doi.org/10.1101/2022.02.09.22270752 Simulation Platforms to Support Teaching and Research in Epidemiological Dynamics].

;[https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sirsdtvdet/index.html Deterministic SIRS with Vaccinations]
:A mass-action SIRS model with vaccinations described in the publication [https://doi.org/10.1101/2022.02.09.22270752 Simulation Platforms to Support Teaching and Research in Epidemiological Dynamics].

;[https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sirsdtvsto/index.html Stochastic SIRS with Vaccinations]
:A stochastic version of the previous model. See [https://doi.org/10.1101/2022.02.09.22270752 Simulation Platforms to Support Teaching and Research in Epidemiological Dynamics]

;[https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sdsir/index.html SD SIR]
:A simple mass-action SIR model demonstrating the WebKit Sensitivity analysis platform.

These new examples take advantage of 2 new WebKit features: Settings Presets and RAMs (runtime configurable modules). Settings Presets are a set of "radio" buttons that can be programmed to retain and recall the current settings (Preset 0 is always the "factory" default). Presets will persist in a given browser from session to session. They can be saved for safe keeping and/or for transferring between browsers.

RAMs are significant choices in the algorithm of the model and are always documented. If a project includes one or more RAMs, radio buttons will appear at the top of the side panel (open using [[File:sideicon.png]]) to access each individual RAM. Each RAM displays a set of alternatives, some of which may require parameters. The Default RAM always represents "factory" settings.

The '''Immune to Vaccinated''' RAM in '''Deterministic SIRS w/ Vaccinations''' contains a '''User Input''' RAM selection in which users can create their own expressions using a set of parameters provided by the RAM. An example is contained in Preset 1.

The best way to use RAMs is to save the current settings in a preset, since the settings saved in a preset includes the current RAM selection and any RAM configuration parameters. Recalling that preset properly selects and initializes the desired RAM alternative.

The Extended Game of Life includes 8 interesting choices for the Initial State RAM that it supports. Use the New Preset spinner to view and run each of these.

'''More detailed documentation for Presets and RAMs is currently underway and will be available soon'''.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/agents/index.html Agents]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/antz/index.html Ants]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/diffuse/index.html Diffusion]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/dla/index.html Diffusion Limited Aggregration]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/exgrowth/index.html Exponential Growth]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/fng/index.html Fungal Growth]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/follower/index.html Follower]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/forest/index.html Forest]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/fworks/index.html Fireworks]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/life/index.html Life]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/lifeagents/index.html Life Agents]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/lotka/index.html Lotka-Volterra Model]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/mongoose/index.html Mongoose]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/river/index.html Meandering River]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/rps/index.html Rock Paper Scissors]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/wvmach/index.html Wave Machine]
* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/wolfsheep/index.html Wolf Sheep Predation]

Numerus Wiki

2026-03-19T16:53:32Z

Rsalter: /* Numerus Wiki Content */

== Numerus Wiki Content ==
===Numerus WebKit===
'''Numerus WebKit''' (NuWebKit) is a technology for building powerful simulations that run in a Web browser. It consists of applications and APIs that support the design of models along the lines of NetLogo, but using conventional languages such as Java, JavaScript and Python. These applications are deployed either from a remote server, or run locally without using any network.
* [[Numerus WebKit | About Numerus WebKit]]
* [[Example NuWebKit Models]] (Javascript platform only)
* [[NuWebKit Examples]] (Java & Javascript platforms)
* [[NuWebKit Users Guide]]
* [[NumML Language Reference]]

===Numerus Designer/Studio and Model Builder===
* [[Example WebKit Models]]* [[Numerus Designer]]
* [[Numerus Studio]]
* [http://wiki.numerusinc.com/index.php/Numerus_Model_Builder_Wiki:_The_Place_for_NumerusMB_Documentation Numerus Model Builder]

===Numerus Downloadable / On-line Apps===
* [[SEIVAgent IBM Epidemic Simulator]]
* [[NMB DASA Covid-19 User Guide]]

WebKit Users Guide

2026-03-19T16:52:56Z

Rsalter: Rsalter moved page WebKit Users Guide to NuWebKit Users Guide: Change of app name

#REDIRECT [[NuWebKit Users Guide]]

NuWebKit Users Guide

2026-03-19T16:52:56Z

Rsalter: Rsalter moved page WebKit Users Guide to NuWebKit Users Guide: Change of app name

Numerus WebKit (NWK) is a technology for building powerful simulations that run in a Web browser. It consists of applications and APIs that support the design of models along the lines of NetLogo (NL) and Stella, but using conventional languages such as Java, JavaScript (JS) and Python.<ref>This API is under development.</ref> These applications are deployed either from a remote server, such as Amazon Web Services (AWS) Elastic Beanstalk (AWSEB), (or, in Java mode, any other server that supports WebSockets, or in JS mode, from any conventional Web or Cloud server); alternatively, they can be run locally without using any network connectivity using a ''localhost'' server. JS development only requires text editing, and Java development can take advantage of the Eclipse J2EE (Jakarta) platform using the Apache Tomcat server.

This Guide will introduce the NWK user interface (UI) and the many useful functions that enhance and support the user's experience. A separate document, the [[WebKit Authors Guide]], is under development.

== Terminology ==
; Model
: A system that is initialized parametrically to an start state and is sequentially clocked to produce a new state and output vector on each clock strobe. NWK supports System Dynamic (SD), Spatial (Sp) and Individual-based (IB) models. Models in NWK are currently implemented either in Javascript or Java.

;Simulation
: A model in execution. Simulations are managed from the UI.

;Spatial (Sp) and Individual-based (IB) models
: Spacial models are represented by a 2-dimensional grid of '''cells'''. At each point in time a cell assumes a '''state''' determined by the values of a set of variables. Some property of the state is visualized by the cell's color. Individual-, or '''agent'''-based models add to this a set of objects, each occupying a cell. Each object is similarly in a state visualized by color, shape and size of either a circle or square. Cells are fixed in place in a grid, with either a Cartesian or hexagonal topology, while agents move about the landscape. The edges of the landscape can either serve as fixed boundaries, or "wrap-around" horizontally and vertically to create a torus. In many simulations with fixed boundaries, agents "bounce off" the edge like a billiard ball. Agents can also bounce off each other like an ideal gas, or not interact. These choices are made by the site's author, and in some cases may be overridden.

;System Dynamics (SD)
: The behavior of SD models over time can often be characterized using differential or difference equations. An SD model might be the entirety of site, or might characterize the local behavior of a cell or agent in Sp and IB models.

;Project
: A single unit deploying 1 or more simulations, usually employing a single Web page. Projects are specified using a '''project file''', containing [https://www.json.org/json-en.html JSON] code detailing the UI and at least providing parameters for the model. Small SD models may be specified in the project file.

;Site
:The Webpage or pages associated with a particular project.

;"Factory Settings"
: Sites are uploaded with parameters and settings determined by the author. Users may change parameters and override some setting, however factory settings can always be recovered.

;"The Drawer"
: The NWK screen has a sliding partition on the right-hand side, controlled by the user, that reveals documentation and other features detailed below when slid leftward.

;Presets
: NWK provides a storage facility to record and recall various choices for settings and parameters. The presets are like "radio buttons" selecting various alternative sets of configurations.

;RAMs
: RAMs (Runtime alterable modules) allow the author to provide the means for selecting sets of alternative algorithms used by the model. Authors may also use the RAM facility to enable a user to completely specify some model (these are called UberRAMs, or URAMs).

;NuML
: NuML (Numerus Modeling Language) is a small, simple, domain-specific language (dsl) that serves 2 functions: 1) to specify the algorithm or model in RAMs and URAMs; and 2) to assert configuration changes to factory settings.

;Analysis Platforms
:These are special tabs used in some sites to enable such facilities as sensitivity analysis, curve fitting, MCMC, etc.

;CSV
:This refers to the option of saving data from a graph to a comma separated list.

== Platform Overview==
[[File:ui0.png|thumb|NWK User Interface]]
This image shows the browser window running the sample individual-based site [https://www.cs.oberlin.edu/~rms/wk/rps/ "Rock Paper Scissors"]. The features are all described later in this guide.
;Model Inputs
:These sliders set parameters for the simulation. Changes are forwarded even while the simulation is running and may have immediate effect.
;Timers
:These windows show the current model time. The left window counts up from 0. If the simulation is designed to run for a fixed time period, the right timer window will be initialized to that time and will count down.
;Operating Buttons
:The '''Connect/Disconnect''' buttons activate/deactivate the connection between the UI and the model logic. Disconnecting and Connecting is one way to restart the application; reloading the page is another.
:The '''Reset''', '''Step''' and '''Start/Stop''' buttons operate the simulation. '''Step''' executes a single time step, '''Start/Stop''' bring about continuous operation, and '''Reset''' restores the initial state and resets the timers. Double-clicking '''Reset''' also reinitializes the application.
[[File:ui1.png|thumb|UI With Drawer Opened]]
;Speed Control
:This determines the real-time interval between steps.
;Displays
:A spatial or agent-based simulation will include a "SimWorld" display that uses graphic cues to show the current state of the model. Among these cues are location and color, for both cells and agents, and, additionally, size and shape for agents.
:Other displays such as Spys (showing a single current value) graphs, tables, etc. are specified in the Project file (see below).
;Side Panel
:The browser page has a side panel contained in a "drawer". Use [[File:sideicon.png]] to toggle it open and closed, or pull on the lavender bar to adjust its location. The drawer contains model documentation, the preset display, a configuration window, and a log window for status reports. If the site uses RAMs the side panel will be wider and will contain access to RAM controls.
[[File:ui2.png|thumb|UI with SD Model]]
;System Dynamics
:The third image shows the model library SD [https://www.cs.oberlin.edu/~rms/wk/lotka Lotka-Volterra] site. An SD site will display the current choices for ''dt'' and integration method (Euler or RK4). These can be overridden from factory settings using the configuration window.
 

In subsequent sections we describe the platform's features with illustrations using one or more of the sites in the model library. The full model library can be found in the [[WebKit Examples]] document. Note that we will be looking at the Javascript model implementation only at this time, as some of the features described here are only available with this implementation.

'''When opening the Model Library examples you are advised to right-click and open the link in a new tab.'''

Among the topics covered are:
* User initialization of spatial and agent-based models
* Presets
* NuML language
* RAMS and URAMS
* Configuration overrides
* Analysis platforms
* Downloading CSVs

== Model Initialization and Using Presets with Conway's Game of Life and Agents (1) ==
[[File:lifeinit.gif|thumb|Initializing Conway's Game of Life]]
[[File:agentsinit.gif|thumb|Initializing Agents (1)]]
[https://www.cs.oberlin.edu/~rms/wk/life/index.html Conway's Game of Life (CGOL)] uses a 128 x 128 board with solid edge and an initial configuration consisting of the "R-pentomino". (Try it!) CGOL's model operates on a cellular automaton with 2 possible states, dead and alive.

[https://www.cs.oberlin.edu/~rms/wk/agents/index.html Agents] is a very simple simulation of agents of different sizes and shapes. The space in which they are moving has elastic walls off of which the agents bounce. They also behave like an ideal gas with respect to their physical interaction. (This behavior was a choice made by the site's author.) [https://www.cs.oberlin.edu/~rms/wk/agents1/index.html Agents (1)] has the same model, only initially empty.

With NWK you can:
* Click and drag to create new initial configurations;
* Save your configuration in the Presets.

=== Creating new initial configurations in CGOL ===

This CGOL simulation uses a Cell Matrix with black/white respectively representing dead/alive. To alter the initial configuration, '''press''' or '''click''' the left mouse button on any black or white cell to toggle that cell to the opposite color. If you press the mouse button, you can '''drag''' the mouse to change dragged-over cells to the new color.

When done, '''click''' the '''Reset''' button once; clicking '''Run''' will execute the simulation with the new configuration, and single clicks on '''Reset''' will restore your initial configuration. '''Double-clicking''' '''Reset''' restores factory settings.

=== Creating new initial configurations in Agents (1) ===

You add agents to Agents (1)'s landscape in a similar manner. '''Shift-click''' on a cell to add an agent, and continue to '''shift-click''' to rotate through cell colors. At the end of the rotation the agent will be deleted. You can also delete an agent immediately with '''alt-shift-click'''.

When done, '''double-click''' '''Reset''', and then '''Run'''. To restore factory settings you must reload the page.

 

== Preset Basics ==
[[File:preset.png|thumb|Preset Control in Drawer Panel]]
The Preset feature provides a quick way to save and restore a configuration, modeled on the "radio buttons" found in cars. The Preset control consists of 13 such preset buttons. Each preset label is either red or green, respectively, depending on whether or not the preset is currently assigned to a configuration. Selecting a "green" label will restore the configuration saved in that preset. Selecting a red label has no effect on the configuration.

'''Note that preset 0 is permanently bound to factory settings and cannot be changed'''.

'''Tags.''' Each preset can be optionally given a tag; i.e., a label used to identify the settings for that preset. Simply enter the tag in the '''Tag''' text field before saving the preset.

[[File:presetDemo.gif|thumb|Preset Control in Main Control Panel]]
Preset and tag selection are also controlled from the main control panel, making it unnecessary to have the drawer open while shifting between different presets. The Preset control is located to the right of the Speed slider, and rotates through the available presets as it is clicked up or down. Tagged presets display their tag when selected.

Configurations are saved and cleared using the '''Save/Clear/Cl All''' buttons to the right of the Preset controls. Whichever preset is selected will be affected by '''Save/Clear'''; '''Cl All''' will delete all presets (except for preset 0).

Presets are stored in the Web browser and will be there when you return to the site. A local JSON file storing the complete current bank of presets is created using the '''Preset ↔ Local File''' controls found to the left of the Configuration window. Use stored presets as a backup, for transferring between browsers, and when you exceed the 12 user preset limit.

----
Something to try

Create a set of CGOL and Agent (1) initial configurations using the mouse as described and store them in presets. Test the presets by restoring the configurations. Practice using ''Save'' and ''Clear'' until you are comfortable with building configurations and storing/restoring them using the presets.
----

=== One more thing about Presets ===
Some site include ready-made presets. These will be installed the first time you access the site. You may make changes to and save ready made presets. You can restore the factory set of ready-mades by deleting all presets and reloading the site.

 

== Using RAMs with the Extended Game of Life 3 (EGOL3) ==
[[File:egol3.png|thumb|Extended Game of Life Showing RAM Panel]]
[[File:egol3RAM.gif|thumb|Preset Selection Showing RAM Choices]]
RAMs provide the means for changing some aspect of the site's model. Each RAM presents a set of alternatives, including a Display or Default alternative that is part of the factory settings. An Alternative may require some additional input through sliders, text fields or text areas. Space is provided so that RAMs are thoroughly documented.

[https://www.biorxiv.org/content/10.1101/2022.08.30.505937v1 EGOL3] is an extension to Conway's Game of Life to 3 live states (birth, newborn and adult). The simulation has been constructed to support 4 alternate approaches to the creating the initial state, which are presented to you as a RAM with 4 alternatives. The RAM is revealed when the drawer is fully open and '''Initial State''' is selected from the RAM Selection Panel (see right).

The RAM Selection Panel appears whenever a site contains one or more RAMs. Selecting a RAM replaces the content of the Documentation Window with overview documentation for the selected RAM. A new column appears topped by the RAM Alternative Selection Panel. Each alternative introduces documentation specific to that alternative and, if needed, a set of input controls (in some cases an input control such as a text area is included for reference only and cannot be edited).

RAMs are powerful tools when combined with presets since the selected RAM and any input values are stored as part of the preset configuration. The factory settings for EGOL3 include 7 different initialization configurations realized mixing different main parameters, RAM alternatives and RAM parameters. You can see this in action by opening the RAM panels as shown and clicking through the 7 presets, as shown at right.

The '''Display''' RAM setting is analogous to the conventional GOL we explored earlier. You can set your own initial configuration through click and drag like before. The '''Random''' setting lets you choose the probabilities for initial live cells. '''Reg6''' and '''Reg Custom''' produce diagonal stripes that repeat with, respectively, a fixed interval of 6 or with an interval between 2 and 12.

----
Something to try

Make changes to the existing presets. When editing a textfield input, be sure to hit '''Enter''' when you are ready to register the change. Save configurations in any of the remaining empty presets, or override the factory presets (except for Preset 0).

When you are done you can restore the initial preset configuration by deleting ''all'' presets with '''Cl All''' and then reloading.
----

== Using RAMs with the Deterministic SIRS w/ Vaccination (SIRS) ==
SIRS is rich with RAMs with one ('''Immune to Vaccinated''') containing an alternative ('''User Input''') requiring code. This alternative lets you program how individuals in class R (recovering) are vaccinated and transferred to class V (vaccinated), as a function of model time. A set of variables that can be referenced in the code is provided.

An example is contained in Preset 1. Here we choose to use apply the vaccination rate from the vaccination onset time (both set with the main input sliders) to a time determined using the RAM slider '''User 1'''. In other words, you add a shut-off time for vaccinations which has not been provided by the original model. Other possibilities for this RAM could be, for example, to let the vaccination rate decay to account for depletion of vaccine, using the '''User 1''' slider to determine the decay rate.

The code used in Preset 1 is Javascript. Press the '''Compile''' button when your are ready. The '''Enlarge''' button opens a browser-wide editor window, making code entry easier. If you want to try your own User Input RAM, be sure to save in a preset or your code will be lost.

== User-Defined Models (URAMs) with Sensitivity Analysis ==

The RAM interface makes it possible to easily implement SD simulations defined entirely by the user. An example from the model library containing 4 user-defined presets is [https://www.cs.oberlin.edu/~rms/wk/sdnumml1/index.html SD User Defined].

Such sites are initially defined only by the input and output components they support. Their operation relies on a user-defined program, specifying the model and its UI, that is entered using a RAM. The example site has a RAM with one option, that option showing a text area for the program. It also provides sufficient input and output components to support the UI needs of models implemented on the site.

The example site includes 6 slider inputs, a line graph and a phase graph. Each of these 8 components need a "handle", an ID by which they can be referenced in the program. The sliders all run from 0 to 1 with 0.01 step size and have the IDs <code>Param1</code>, <code>Param2</code>..., <code>Param6</code>. The line and phase graphs are respectively given IDs <code>mainGraph</code> and <code>phaseGraph</code>.

Visit the model using the link and open the '''Model Definition''' RAM. It contains a single option ('''NuML Code''') with a Code text area. Notice that, although 6 sliders were allotted, only 1 is visible in the default preset. This is a result of the UI configuration contained in the program. As you step through presets note that the input sliders appear and disappear as needed, and that slider and graph legends (names and titles) change to suit the model.

Consider the code for the default Exponential Curve model:
<blockquote>
[[File:expocode.png|400px|Code for Exponential Model]]
</blockquote>
The first line consists of the string "numml". This is required to indicate that the contents are in NuML rather than Javascript. There are 2 sections: '''model''' and '''configurations'''. (Note that "//" is the comment character meaning that this line is ignored by the compiler). In the model section are 4 statements using the operator <code>@=</code>. In fact, each NuML statement uses Javascript syntax, but with 2 non-Javascript operators: <code>@=</code> and <code>#=</code>, which completely program the behavior and look and feel of the simulation. The former is used to specify the model generally in terms of differential (or difference) equations using program variables; the latter asserts properties for the visual components that fit with the particular model

The first block (lines 4 - 8) consists of 3 statements defining the variable of interest, <code>Exp</code>, and one defining an auxiliary variable <code>Rate</code> used in line 4. The latter is not entirely necessary; we could instead have written line 4 as <code>deriv(Exp) @= Param1 * Exp</code>, however the style we used relates the model directly to relabeling of the <code>Param1</code> slider to <code>Rate</code> and consequently is more readable. We will continue to see this approach used in the other models in this site.

<code>deriv(Exp)</code> specifies a differential equation on line 4 relating <code>Exp</code> to itself and local variable <code>Rate</code>. Line 8 binds <code>Rate</code> to <code>Param1</code>, which is the alias we assign to <code>Param1</code> on line 14. Line 5 provides an initial value for <code>Exp</code>, and line 6 links <code>Exp</code> with the line graph <code>mainGraph</code>, which displays its output..

Lines 11 through 16 use operator <code>#=</code> to detail the appearance of the input sliders and output graphs. This is mostly self- explanatory, except for the entry for <code>statsGraph</code>, which will be discussed below. This code is not required, however the result will be a generic display with 6 input sliders labeled <code>Param1</code> through <code>Param6</code>, and graphs with no labels. Note that on line 16, setting the legend for the unused sliders to an empty string hides them.

Look at the remaining preset code. Preset 3, in particular, is a good example of the extent to which input sliders can be detailed. This is required because the generic slider properties do not match the value range required in the simulation. Refer to the [[NuML Language Reference]] for a complete description of the NuML language.

'''If you make changes to any of these that you want to save to presets, you should compile before saving so that the compiled code will be loaded when you activate the preset.'''

=== Sensitivity Analysis ===

One of the goals of NWK is to provide secondary platforms for optimization and analysis. To date one such platform exists to perform sensitivity analysis, primarily but not exclusively for SD models. Once again, refer to [https://www.cs.oberlin.edu/~rms/wk/sdnumml1/index.html SD User Defined] to see this in action. Open this site and click on the tab labeled '''Sensitivity'''.

[[File:sens0.png|thumb|Sensitivity Analysis Platform after a run]]
The figure show on the right shows the Sensitivity Analysis platform for the logistic model (Preset 1) after a run. There are 4 user parameters that govern the behavior as shown:

* '''Parameter''': which parameter is varied (in this model it is '''Rate''').
* '''Runs''': how many runs (20);
* '''From''': initial value (0.25);
* '''To''': final value (0.54);

Clicking '''Start''' initiates 20 runs with the '''Rate''' parameter uniformly stepping through intermediate values between 0.25 and 0.54. During this run, clicking '''Stop''' allows the most recent run to finish, allowing the process to continue by subsequently clicking '''Start'''. Alternatively, clicking '''Step''' proceeds one run at a time until the process concludes. Double-clicking '''Reset''' reinitializes the run.

Results are displayed on 2 graphs, the first being identical to the one on the '''Run''' platform. To its right is a graph showing mean ± standard deviation of the point-wise variations seen in the run.

Now open the '''Model Definition''' RAM and look at the code in lines 12 - 15 to see how the Sensitivity Analysis platform was programmed. The statistics display has ID ''statsGraph''. In addition to specifying a title ("Logistic Statistics"), we see the following entries:
;statDat(N)
:''N'' is output variable of interest
;statParam(Rate)
:''Rate'' is the input parameter to be varied
;statRuns(20), statLo(0.25), statHi(0.54)
:20 runs with ''Rate'' varying uniformly between 0.25 and 0.54
Note that except for '''statDat''', these settings are shown in textfields and merely initialize their parameters. They can be changed, and changes are saved to presets.

== Configuration Overrides ==
[[File:config.png|thumb|Configuration Window]]
NuML statements using <code>#=</code> can be used to configure most models using the Configuration window below the Preset selection window. Shown at right is an override of the factory settings that changes the ''dt'' value and asserts Euler as the integration method. Other overrides will become available soon.
 

== CSV Downloads ==
If a graph contains a '''CSV''' button, clicking that button once the graph has been filled will bring about a download of a CSV (comma separate values) file of the data from that graph. The settings used by the simulation will be recorded above the CSV header.

Example WebKit Models

2026-03-19T16:52:26Z

Rsalter: Rsalter moved page Example WebKit Models to Example NuWebKit Models: Change of app name

#REDIRECT [[Example NuWebKit Models]]

Example NuWebKit Models

2026-03-19T16:52:25Z

Rsalter: Rsalter moved page Example WebKit Models to Example NuWebKit Models: Change of app name

These models illustrate the NuWebKit modeling technology. To use, load the model into your browser and click '''Connect''' to initialize the model. This will enable the other 4 buttons: '''Disconnect''', '''Reset''', '''Step''' and '''Start'''. Use the '''Start/Stop''' button to run the program continuously. '''Step''' single-steps the program. '''Reset''' returns to the beginning. A '''Double-Reset''' reinitializes the simulation. You can also reinitialize with '''Disconnect/Connect''', or simply reloading the web page. See the [[WebKit Users Guide]] for complete documentation.

Be aware of the side panel, which you open and close by clicking on the side panel icon, [[File:sideicon.png]], and adjust using the purple stripe. This panel contains documentation, preset control and RAM access.

NetLogo is an established platform for implementing agent-based models. NuWebKit uses an API analogous to that of NetLogo, keeping the "Patches" and "Turtles" nomenclature and making the translation from NetLogo the NuWebKit straightforward. Many of the agent-based models in this collection were derived from the NetLogo model library. All such examples include NetLogo documentation, which for now serves to describe the model but may not totally match the NuWebKit implementation.

===Numerus Originals===

* [https://www.cs.oberlin.edu/~rms/wk/egol3/index.html Three State Extended Game of Life]
:A 3-state extended version of Conway's Game of Life (GoL). The mathematical equations behind this GoL are described in a paper that can be downloaded at [https://www.biorxiv.org/content/10.1101/2022.08.30.505937v1 mathRxiv]. Click through the 8 presets to view different starting configurations, and feel free to save your own interesting discoveries in unused presets. This model is a focus of the [[WebKit Users Guide]] as an example that makes extensive use of the RAM and preset features.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sirsdet/index.html SIRS WebKit App]
:Fully developed platform for teaching the SIRS Model. Documented extensively [https://e56600a52a1b6dbf8d29-34f1371aa433cd9fb9d20baa556ed72a.ssl.cf1.rackcdn.com/webapps/webkit/EPI_LESSONS.pdf here].

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sirsdtvdet/index.html Deterministic SIRS with Vaccinations]
:A mass-action SIRS model with vaccinations described in the publication [https://doi.org/10.1101/2022.02.09.22270752 Simulation Platforms to Support Teaching and Research in Epidemiological Dynamics]. This app was merged into the previous example to create a fully developed platform for teaching the SIRS model.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sirsdtvsto/index.html Stochastic SIRS with Vaccinations]
:A stochastic version of the previous model. See [https://doi.org/10.1101/2022.02.09.22270752 Simulation Platforms to Support Teaching and Research in Epidemiological Dynamics]

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sdsir/index.html SD SIR]
:A simple mass-action SIR model demonstrating the WebKit Sensitivity analysis platform.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sdnumml1/index.html SD User Defined]
:An app in which the user programs the model. Discussed extensively in the [[WebKit Users Guide]].

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/agents/index.html Agents]
:Simple agent motion.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/ani2/index.html Animover 2]
: '''Animover''' is a model of a group of agents foraging in an area for a food resource. Animover 2 is a preliminary version. It is the most complex WebKit simulation to date, with several thousand lines of code required to implement the model logic.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/forest/index.html Forest]
:Cell automata model depicting a forest fire.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/life/index.html Life]]
:Conway's Game of Life. Enough said. See the [[WebKit Users Guide]] to learn how to initialize the starting configuration.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/lifeagents/index.html Life Agents]
:Game of Life with agent motion. An agent passing over a live cell colors the cell with the agent's color.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/lorenz/index.html Lorenz Attractor]
:The Lorenz system is a system of ordinary differential equations first studied by mathematician and meteorologist Edward Lorenz. It is notable for having chaotic solutions for certain parameter values and initial conditions. The term "butterfly effect" in popular media may stem from the real-world implications of the Lorenz attractor, namely that tiny changes in initial conditions evolve to completely different trajectories.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/lotka/index.html Lotka-Volterra Model]
:Shows both time and phase graphs.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/mongoose/index.html Mongoose Behavior]
:Companion to "Computational Assessment of Population Resilience Mechanisms in the Banded Mongoose (Mungos mungo) of Northern Botswana" (manuscript in progress).

===NetLogo Translations===

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/antz/index.html Ants]
:NetLogo model. A colony of ants forages for food. Though each ant follows a set of simple rules, the colony as a whole acts in a sophisticated way.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/diffuse/index.html Diffusion]
:NetLogo diffusion example. Diffusion Graphics is unlike most other NetLogo models, in that it really doesn’t ‘model’ anything. It simply explores the power behind an interesting patch primitive: ‘diffuse’.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/dla/index.html Diffusion Limited Aggregration]
:This model demonstrates diffusion-limited aggregation, in which randomly moving (diffusing) particles stick together (aggregate) to form beautiful treelike branching fractal structures. There are many patterns found in nature that resemble the patterns produced by this model: crystals, coral, fungi, lightning, and so on.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/flock/index.html Flock]
:NetLogo model showing the flocking of birds. The resulting motion also resembles schools of fish.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/fng/index.html Fungal Growth]
:NetLogo model showing the spread of fungal hyphae throughout a section of earth in which moisture is spreading.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/follower/index.html Follower]
:NetLogo model. In Follower, turtles attempt to “connect” with other turtles, forming long chains according to a small set of simple rules.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/fworks/index.html Fireworks]
:NetLogo model. This program models the action of fireworks. Rockets begin at the bottom of the view, shoot upwards into the sky and then explode, emitting showers of falling sparks. Works best at lower speed.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/river/index.html Meandering River]
:Netlogo Model. This model demonstrates the meandering of a river along its “middle course”, where the gradient of the landscape is gradual and the river runs within a U-shaped river valley. The evolution of the shape of the river is governed by the path of its highest-velocity flow, as well as erosion and deposition.
:This example has documentation extracted from the Netlogo version. Click the icon on the top-right of the page.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/rps/index.html Rock Paper Scissors]
:NetLogo Model. This model explores the role of movement and space in a three species ecosystem. The system consists of three species, represented by red patches, green patches, and blue patches, which compete over space. The interactions between the species are based on the game Rock-Paper-Scissors. That is, red beats green, green beats blue, and blue beats red. Organisms compete with their neighbors, move throughout the environment, and reproduce. These interactions result in spiral patterns whose size and stability depends on the movement rate of the organisms.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/wolfsheep/index.html Wolf Sheep Predation]
:NetLogo Model. A population of sheep that wander around the landscape. For each step the sheep take it costs them some energy and if there energy gets too low they die. However, the sheep can eat grass in the environment to regain energy and the grass regrows over time. If the energy of the sheep gets above a certain level then they can reproduce. There are also wolves that have the same behaviors as sheep except for eating; rather than grass, they eat sheep.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/wvmach/index.html Wave Machine]
:Netlogo Model. This model simulates wave motion in a membrane. The four edges of the membrane are fixed to a frame. A green rectangular area represents a driver plate that moves up and down, exhibiting sinusoidal motion.

Example NuWebKit Models

2026-03-19T16:52:03Z

Rsalter:

These models illustrate the NuWebKit modeling technology. To use, load the model into your browser and click '''Connect''' to initialize the model. This will enable the other 4 buttons: '''Disconnect''', '''Reset''', '''Step''' and '''Start'''. Use the '''Start/Stop''' button to run the program continuously. '''Step''' single-steps the program. '''Reset''' returns to the beginning. A '''Double-Reset''' reinitializes the simulation. You can also reinitialize with '''Disconnect/Connect''', or simply reloading the web page. See the [[WebKit Users Guide]] for complete documentation.

Be aware of the side panel, which you open and close by clicking on the side panel icon, [[File:sideicon.png]], and adjust using the purple stripe. This panel contains documentation, preset control and RAM access.

NetLogo is an established platform for implementing agent-based models. NuWebKit uses an API analogous to that of NetLogo, keeping the "Patches" and "Turtles" nomenclature and making the translation from NetLogo the NuWebKit straightforward. Many of the agent-based models in this collection were derived from the NetLogo model library. All such examples include NetLogo documentation, which for now serves to describe the model but may not totally match the NuWebKit implementation.

===Numerus Originals===

* [https://www.cs.oberlin.edu/~rms/wk/egol3/index.html Three State Extended Game of Life]
:A 3-state extended version of Conway's Game of Life (GoL). The mathematical equations behind this GoL are described in a paper that can be downloaded at [https://www.biorxiv.org/content/10.1101/2022.08.30.505937v1 mathRxiv]. Click through the 8 presets to view different starting configurations, and feel free to save your own interesting discoveries in unused presets. This model is a focus of the [[WebKit Users Guide]] as an example that makes extensive use of the RAM and preset features.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sirsdet/index.html SIRS WebKit App]
:Fully developed platform for teaching the SIRS Model. Documented extensively [https://e56600a52a1b6dbf8d29-34f1371aa433cd9fb9d20baa556ed72a.ssl.cf1.rackcdn.com/webapps/webkit/EPI_LESSONS.pdf here].

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sirsdtvdet/index.html Deterministic SIRS with Vaccinations]
:A mass-action SIRS model with vaccinations described in the publication [https://doi.org/10.1101/2022.02.09.22270752 Simulation Platforms to Support Teaching and Research in Epidemiological Dynamics]. This app was merged into the previous example to create a fully developed platform for teaching the SIRS model.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sirsdtvsto/index.html Stochastic SIRS with Vaccinations]
:A stochastic version of the previous model. See [https://doi.org/10.1101/2022.02.09.22270752 Simulation Platforms to Support Teaching and Research in Epidemiological Dynamics]

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sdsir/index.html SD SIR]
:A simple mass-action SIR model demonstrating the WebKit Sensitivity analysis platform.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sdnumml1/index.html SD User Defined]
:An app in which the user programs the model. Discussed extensively in the [[WebKit Users Guide]].

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/agents/index.html Agents]
:Simple agent motion.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/ani2/index.html Animover 2]
: '''Animover''' is a model of a group of agents foraging in an area for a food resource. Animover 2 is a preliminary version. It is the most complex WebKit simulation to date, with several thousand lines of code required to implement the model logic.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/forest/index.html Forest]
:Cell automata model depicting a forest fire.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/life/index.html Life]]
:Conway's Game of Life. Enough said. See the [[WebKit Users Guide]] to learn how to initialize the starting configuration.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/lifeagents/index.html Life Agents]
:Game of Life with agent motion. An agent passing over a live cell colors the cell with the agent's color.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/lorenz/index.html Lorenz Attractor]
:The Lorenz system is a system of ordinary differential equations first studied by mathematician and meteorologist Edward Lorenz. It is notable for having chaotic solutions for certain parameter values and initial conditions. The term "butterfly effect" in popular media may stem from the real-world implications of the Lorenz attractor, namely that tiny changes in initial conditions evolve to completely different trajectories.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/lotka/index.html Lotka-Volterra Model]
:Shows both time and phase graphs.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/mongoose/index.html Mongoose Behavior]
:Companion to "Computational Assessment of Population Resilience Mechanisms in the Banded Mongoose (Mungos mungo) of Northern Botswana" (manuscript in progress).

===NetLogo Translations===

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/antz/index.html Ants]
:NetLogo model. A colony of ants forages for food. Though each ant follows a set of simple rules, the colony as a whole acts in a sophisticated way.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/diffuse/index.html Diffusion]
:NetLogo diffusion example. Diffusion Graphics is unlike most other NetLogo models, in that it really doesn’t ‘model’ anything. It simply explores the power behind an interesting patch primitive: ‘diffuse’.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/dla/index.html Diffusion Limited Aggregration]
:This model demonstrates diffusion-limited aggregation, in which randomly moving (diffusing) particles stick together (aggregate) to form beautiful treelike branching fractal structures. There are many patterns found in nature that resemble the patterns produced by this model: crystals, coral, fungi, lightning, and so on.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/flock/index.html Flock]
:NetLogo model showing the flocking of birds. The resulting motion also resembles schools of fish.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/fng/index.html Fungal Growth]
:NetLogo model showing the spread of fungal hyphae throughout a section of earth in which moisture is spreading.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/follower/index.html Follower]
:NetLogo model. In Follower, turtles attempt to “connect” with other turtles, forming long chains according to a small set of simple rules.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/fworks/index.html Fireworks]
:NetLogo model. This program models the action of fireworks. Rockets begin at the bottom of the view, shoot upwards into the sky and then explode, emitting showers of falling sparks. Works best at lower speed.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/river/index.html Meandering River]
:Netlogo Model. This model demonstrates the meandering of a river along its “middle course”, where the gradient of the landscape is gradual and the river runs within a U-shaped river valley. The evolution of the shape of the river is governed by the path of its highest-velocity flow, as well as erosion and deposition.
:This example has documentation extracted from the Netlogo version. Click the icon on the top-right of the page.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/rps/index.html Rock Paper Scissors]
:NetLogo Model. This model explores the role of movement and space in a three species ecosystem. The system consists of three species, represented by red patches, green patches, and blue patches, which compete over space. The interactions between the species are based on the game Rock-Paper-Scissors. That is, red beats green, green beats blue, and blue beats red. Organisms compete with their neighbors, move throughout the environment, and reproduce. These interactions result in spiral patterns whose size and stability depends on the movement rate of the organisms.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/wolfsheep/index.html Wolf Sheep Predation]
:NetLogo Model. A population of sheep that wander around the landscape. For each step the sheep take it costs them some energy and if there energy gets too low they die. However, the sheep can eat grass in the environment to regain energy and the grass regrows over time. If the energy of the sheep gets above a certain level then they can reproduce. There are also wolves that have the same behaviors as sheep except for eating; rather than grass, they eat sheep.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/wvmach/index.html Wave Machine]
:Netlogo Model. This model simulates wave motion in a membrane. The four edges of the membrane are fixed to a frame. A green rectangular area represents a driver plate that moves up and down, exhibiting sinusoidal motion.

NuWebKit

2026-03-19T16:50:01Z

Rsalter:

Numerus Wiki

2026-03-19T16:47:51Z

Rsalter: /* Numerus Wiki Content */

== Numerus Wiki Content ==
===Numerus WebKit===
'''Numerus WebKit''' (NuWebKit) is a technology for building powerful simulations that run in a Web browser. It consists of applications and APIs that support the design of models along the lines of NetLogo, but using conventional languages such as Java, JavaScript and Python. These applications are deployed either from a remote server, or run locally without using any network.
* [[Numerus WebKit | About Numerus WebKit]]
* [[Example WebKit Models]] (Javascript platform only)
* [[WebKit Examples]] (Java & Javascript platforms)
* [[WebKit Users Guide]]
* [[NumML Language Reference]]

===Numerus Designer/Studio and Model Builder===
* [[Example WebKit Models]]* [[Numerus Designer]]
* [[Numerus Studio]]
* [http://wiki.numerusinc.com/index.php/Numerus_Model_Builder_Wiki:_The_Place_for_NumerusMB_Documentation Numerus Model Builder]

===Numerus Downloadable / On-line Apps===
* [[SEIVAgent IBM Epidemic Simulator]]
* [[NMB DASA Covid-19 User Guide]]

MediaWiki:Sidebar

2026-03-19T16:46:25Z

Rsalter:

* navigation
** mainpage|mainpage-description
** Numerus WebKit|Numerus WebKit
** Example WebKit Models | Example WebKit Models (Javascript platform)
** WebKit Examples|WebKit Examples (Java and Javascript platforms)
** WebKit Users Guide | WebKit Users Guide
** NuML Language Reference | NuML Language Reference
*
** Numerus_Designer|Numerus Designer
** Numerus Studio|Numerus Studio
** Numerus_Model_Builder_Wiki:_The_Place_for_NumerusMB_Documentation|Numerus Model Builder

* Numerus Users Manual
** About Numerus Model Builder|About Numerus Model Builder
** How To Get Help While Using Numerus|How To Get Help While Using Numerus
** Tutorials|Tutorials
* Modeling Concepts
** Modeling 101|Modeling 101
** Modeling in Numerus|Modeling in Numerus
** Numerus Simulation Architecture|Numerus Simulation Architecture
* User Guide
** Frames, Menus, Toolbars| Frames, Menus, Toolbars
** Modeling Actions | Modeling Actions
** Running Your Model | Running Your Model
** Component Guide I: Atomic Components | Component Guide I: Atomic Components
** Component Guide II: Containers | Component Guide II: Containers
** Component Guide III: Displays and Controls | Component Guide III: Displays and Controls
** Component Guide IV: Plugins | Component Guide IV: Plugins
** Documenting Your Model | Documenting Your Model
** Preferences | Preferences
** Javascript Light | Javascript Light
** NovaScript Introduction | NovaScript Introduction
* Reference
** Primitive Operators and Properties|Primitive Operators and Properties
** Glossary|Glossary

** recentchanges-url
** randompage-url
** helppage

* SEARCH
* TOOLBOX
* LANGUAGES

NumML Language Reference

2026-03-19T16:44:49Z

Rsalter: Rsalter moved page NumML Language Reference to NuML Language Reference: Change of Language Name

#REDIRECT [[NuML Language Reference]]

NuML Language Reference

2026-03-19T16:44:49Z

Rsalter: Rsalter moved page NumML Language Reference to NuML Language Reference: Change of Language Name

==What is NuML?==

NuML is a small, domain-specific language (dsl) for coding SD models and configuring the UI of a NuWebKit (NWK) site. It is used in URAM models and in the Configuration Window. This document serves as reference for NWK authors and users wishing to use NuML in their designs.

==Overview==
NuML serves two purposes: (1) to specify a system dynamics (SD) model program; and (2) to override the factory settings configuration for inputs, displays, and model operation. The choice of operator in an NuML statement, from the two described in the next section, respectively determines its purpose. To specify an SD program, NuML has special operators for defining a differential or difference equation with initial values. There are also primitive operators (primops) to supply random values and compute useful mathematical functions. To override factory settings there are operators to configure properties of input and display components, and to fix integration parameters. Finally, there are operators to configure properties of the analytical platforms. Currently there is only 1 of these (sensitivity analysis), and NuML will be extended as more such platforms become available.

==NuML Operators==
NuML uses Javascript syntax extended with 2 infix operators (<code>@=</code> and <code>#=</code>) that are not recognized as meaningful to Javascript. NWK uses a Javascript parser extended to accept these operators to analyze NuML code and respectively generate code or change the value of specific configuration parameters. Each NuML statement has the form:
<blockquote>
''LHS'' <code>@=</code> ''RHS'' 
''LHS'' <code>@=</code> ''RHS''; 
''LHS'' <code>@#</code> ''RHS'' 
''LHS'' <code>@#</code> ''RHS'';
</blockquote>
with slightly different rules for what is allowed on each side of the operator. In discussing NuML syntax we use the following terminology:

==Language Categories==
;Constant
:Either a string constant enclosed in single or double quotes (<code>'Infection Stats'</code>, <code>"SIR Model""</code>) or a number in decimal (<code>3.1415</code>) or scientific notation (<code>3.14159e5</code>).
;Identifier
:Equivalent of a Javascript variable such as <code>Sigma</code>, <code>N</code>, <code>beta</code>, etc.
;Unary Expression
:An unary operator modifying a term, such as <code>-10</code> or <code>-Sigma</code>.
;Call Expression
:A function name followed by a comma-separated sequence of arguments enclosed in parentheses. The function name must be an identifier; the arguments can be any list of terms.
;Term
:Either a constant, identifier, unary expression, or a call expression using one of the following function names, which differ for <code>@=</code> and <code>@#</code>. These functions are called '''primops''' and are discussed below.
:<code>@=</code>:
<blockquote><code>choose</code>, <code>multinomial</code>, <code>binomial</code>, <code>poisson</code>, <code>flip</code>, <code>normal</code>, <code>irandom</code>, <code>random</code>, <code>PI</code>, <code>PI2</code>, <code>Pi2</code>, <code>Pi34</code>, <code>degToRad</code>, <code>radToDeg</code>, <code>cos</code>, <code>sin</code>, <code>tan</code>, <code>acos</code>, <code>asin</code>, <code>atan</code>, <code>atan2</code>, <code>cosh</code>, <code>sinh</code>, <code>tanh</code>, <code>acosh</code>, <code>asinh</code>, <code>atanh</code>
</blockquote>
:<code>@#</code>
<blockquote>
<code>legend</code>, <code>phase</code>, <code>title</code>, <code>statDat</code>, <code>statParam</code>, <code>integration</code>,<code>statRuns</code>, <code>statLo</code>, <code>statHi</code>, <code>min</code>, <code>max</code>, <code>step</code>, <code>xlabel</code>, <code>ylabel</code>, <code>interval</code>
</blockquote>

;Computational Expression
:A single term or a sequence of terms connected using arithmetic operators <code>+</code>, <code>-</code>, <code>*</code> <code>/</code>, or any other legal Javascript operators.
;Array
:A comma-separated sequence of terms enclosed in square brackets; e.g., <code>[Sigma, foo(1,2,3), 15.123e3]</code>.

==Syntax Rules for <code>@=</code>==

''LHS'' can be:
:An identifier
:A call expression of the form:
::<code>deriv(''ident'')</code>
::<code>initial(''ident'')</code>
::<code>update(''ident1'', ''ident2'', ...)</code>
:these are discussed below.

''RHS'' can be
: A computational expression when ''LHS'' is either <code>deriv</code>, <code>initial</code> or an identifier.
: An identifier when ''LHS'' is <code>update</code>

Examples
<blockquote>
<code> 
deriv(S) @= -beta * S * I / N 
deriv(I) @= beta * S * I / N - sigma * I 
deriv(R) @= sigma * I 
initial(S) @= N - I0 
initial(I) @= I0 
initial(R) @= 0 
update(S,I,R) @= mainGraph 
N @= Param1 
beta @= Param2 
I0 @= Param3 
sigma @= Param4 
</code>
</blockquote>

== Semantic Rules for <code>@=</code> ==

* <code>deriv(''Arg'')</code> asserts a that the ''RHS'' equation is the time derivative of ''Arg''
* <code>initial(''Arg'')</code> asserts that the ''RHS'' is the initial value of ''Arg''
* <code>update(''Arg1'', ''Arg2'', ...)</code> asserts that ''Arg1'', ''Arg2'', ... should be downloaded to the output component with ID of the ''RHS''. The arguments should match the legend assigned to the output component

An identifier appearing on the ''LHS'' is defined by the expression on the ''RHS''.

== Syntax Rules for <code>#=</code> ==

''LHS'' can be
: An identifier
: An array of identifiers

''RHS'' can be
: A constant, primop, or array of primops

Examples:
<blockquote>
<code> 
mainGraph #= [legend(S,I,R), title("SIR Model")] 
statsGraph #= title("Infection Stats") 
statsGraph #= [statDat(I),statParam(Beta),statRuns(12),statLo(3.4),statHi(4.5)] 
Param1 #= [legend(N),max(1000000),step(1000)] 
Param2 #= [legend(Beta),max(10),step(0.1)] 
Param3 #= [legend(I0),max(10),step(0.1)] 
Param4 #= [legend(Sigma),max(10),step(0.1)]; 
[Param5, Param6] #= legend(""); 
</code>
</blockquote>

== Semantic Rules for <code>#=</code> ==
* Identifiers on the ''LHS'' reference component IDs or parameters such as <code>dt</code>
* Constants on the ''RHS'' are only used with parameters and assign values to them.
* Primops on the ''RHS'' are only used with component IDs and define attributes such as legend, max value, etc.
* Arrays on either side "multiply out" to as sequence of statements and are there for convenience.

== Primops for <code>@=</code> ==

====Random Number Generation====

;<code>choose(size)</code>
:Randomly picks a number from 0 to ''size-1'' with uniform probability.
;<code>choose(p0, p1, ... pn-1)</code>
:If the ''pi'' sum to 1, then this function randomly picks a number from 0 to ''n-1'' with the indicated probabilities. If the ''pi'' sum to less than 1, then the function returns ''n'' with probability 1 - ''Σ pi''.

;<code>flip(p)</code>
:Returns 1 with probability ''p''; 0 otherwise

;<code>binomial(n, p)</code>
:Returns the sum of ''n'' independent ''flip(p)'' calls.

;<code>multinomial(N, p0, p1, ... pn-1)</code>
:Performs ''N'' independent ''choose(p0, p1, ... pn-1)'' calls and returns a vector of ''n'' (or ''n+1'') values ''(v0, v1, ...)'' where ''vi'' is the number of times ''i'' was selected.

;<code>poisson(lambda)</code>
:Returns a random value 0, 1, ... distributed using the Poisson distribution with density ''lambda''.

;<code>normal(m, s)</code>
:Returns a random value distributed using a Gaussian distribution with mean ''m'' and standard deviation ''s''.

;<code>irandom(y)</code>
:Returns a random integer between 0 and ''y''.
;<code>irandom(x, y)</code>
:Returns a random integer between ''x'' and ''y''.

====Trigonometric Functions====
;<code>cos, sin, tan, acos, asin, atan, atan2, cosh, sinh, tanh, acosh, asinh, atanh</code>
:Note: <code>(atan2 y x)</code> is <code>(atan y/x)</code> extended to handle the case where ''x == 0''.

====Constants====

;<code>PI, PI2, Pi2, Pi34</code>
:Respectively, π, 2π, π/2, 3π/4

;degToRad
:π/180

;radToDeg
:180/π

== Primops for <code>@#</code> ==

Assigned to runtime graphs and displays:
:'''legend'''
:'''title'''
:'''xlabel'''
:'''ylabel'''
:'''interval''' (between plots)

Assigned to input sliders
:'''legend'''
:'''min'''
:'''max'''
:'''step'''

Integration Control
:'''dt'''
:'''integration''' ('''RK4''' or '''Euler''')

Sensitivity Analysis Platform
;statParam
:Parameter varied by sensitivity test
;statDat
:Value to be graphed
;statRuns
:Number of runs
;StatLo, StatHi
:Testing boundaries

NuML Language Reference

2026-03-19T16:43:56Z

Rsalter:

2025-11-12T16:17:37Z

Rsalter:

These models illustrate the Numerus WebKit modeling technology. To use, load the model into your browser and click '''Connect''' to initialize the model. This will enable the other 4 buttons: '''Disconnect''', '''Reset''', '''Step''' and '''Start'''. Use the '''Start/Stop''' button to run the program continuously. '''Step''' single-steps the program. '''Reset''' returns to the beginning. A '''Double-Reset''' reinitializes the simulation. You can also reinitialize with '''Disconnect/Connect''', or simply reloading the web page. See the [[WebKit Users Guide]] for complete documentation.

Be aware of the side panel, which you open and close by clicking on the side panel icon, [[File:sideicon.png]], and adjust using the purple stripe. This panel contains documentation, preset control and RAM access.

NetLogo is an established platform for implementing agent-based models. Numerus WebKit uses an API analogous to that of NetLogo, keeping the "Patches" and "Turtles" nomenclature and making the translation from NetLogo the WebKit straightforward. Many of the agent-based models in this collection were derived from the NetLogo model library. All such examples include NetLogo documentation, which for now serves to describe the model but may not totally match the WebKit implementation.

===Numerus Originals===

* [https://www.cs.oberlin.edu/~rms/wk/egol3/index.html Three State Extended Game of Life]
:A 3-state extended version of Conway's Game of Life (GoL). The mathematical equations behind this GoL are described in a paper that can be downloaded at [https://www.biorxiv.org/content/10.1101/2022.08.30.505937v1 mathRxiv]. Click through the 8 presets to view different starting configurations, and feel free to save your own interesting discoveries in unused presets. This model is a focus of the [[WebKit Users Guide]] as an example that makes extensive use of the RAM and preset features.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sirsdet/index.html SIRS WebKit App]
:Fully developed platform for teaching the SIRS Model. Documented extensively [https://e56600a52a1b6dbf8d29-34f1371aa433cd9fb9d20baa556ed72a.ssl.cf1.rackcdn.com/webapps/webkit/EPI_LESSONS.pdf here].

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sirsdtvdet/index.html Deterministic SIRS with Vaccinations]
:A mass-action SIRS model with vaccinations described in the publication [https://doi.org/10.1101/2022.02.09.22270752 Simulation Platforms to Support Teaching and Research in Epidemiological Dynamics]. This app was merged into the previous example to create a fully developed platform for teaching the SIRS model.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sirsdtvsto/index.html Stochastic SIRS with Vaccinations]
:A stochastic version of the previous model. See [https://doi.org/10.1101/2022.02.09.22270752 Simulation Platforms to Support Teaching and Research in Epidemiological Dynamics]

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sdsir/index.html SD SIR]
:A simple mass-action SIR model demonstrating the WebKit Sensitivity analysis platform.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/sdnumml1/index.html SD User Defined]
:An app in which the user programs the model. Discussed extensively in the [[WebKit Users Guide]].

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/agents/index.html Agents]
:Simple agent motion.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/forest/index.html Forest]
:Cell automata model depicting a forest fire.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/life/index.html Life]]
:Conway's Game of Life. Enough said. See the [[WebKit Users Guide]] to learn how to initialize the starting configuration.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/lifeagents/index.html Life Agents]
:Game of Life with agent motion. An agent passing over a live cell colors the cell with the agent's color.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/lorenz/index.html Lorenz Attractor]
:The Lorenz system is a system of ordinary differential equations first studied by mathematician and meteorologist Edward Lorenz. It is notable for having chaotic solutions for certain parameter values and initial conditions. The term "butterfly effect" in popular media may stem from the real-world implications of the Lorenz attractor, namely that tiny changes in initial conditions evolve to completely different trajectories.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/lotka/index.html Lotka-Volterra Model]
:Shows both time and phase graphs.

===NetLogo Translations===

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/antz/index.html Ants]
:NetLogo model. A colony of ants forages for food. Though each ant follows a set of simple rules, the colony as a whole acts in a sophisticated way.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/diffuse/index.html Diffusion]
:NetLogo diffusion example. Diffusion Graphics is unlike most other NetLogo models, in that it really doesn’t ‘model’ anything. It simply explores the power behind an interesting patch primitive: ‘diffuse’.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/dla/index.html Diffusion Limited Aggregration]
:This model demonstrates diffusion-limited aggregation, in which randomly moving (diffusing) particles stick together (aggregate) to form beautiful treelike branching fractal structures. There are many patterns found in nature that resemble the patterns produced by this model: crystals, coral, fungi, lightning, and so on.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/fng/index.html Fungal Growth]
:NetLogo model showing the spread of fungal hyphae throughout a section of earth in which moisture is spreading.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/follower/index.html Follower]
:NetLogo model. In Follower, turtles attempt to “connect” with other turtles, forming long chains according to a small set of simple rules.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/fworks/index.html Fireworks]
:NetLogo model. This program models the action of fireworks. Rockets begin at the bottom of the view, shoot upwards into the sky and then explode, emitting showers of falling sparks. Works best at lower speed.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/river/index.html Meandering River]
:Netlogo Model. This model demonstrates the meandering of a river along its “middle course”, where the gradient of the landscape is gradual and the river runs within a U-shaped river valley. The evolution of the shape of the river is governed by the path of its highest-velocity flow, as well as erosion and deposition.
:This example has documentation extracted from the Netlogo version. Click the icon on the top-right of the page.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/rps/index.html Rock Paper Scissors]
:NetLogo Model. This model explores the role of movement and space in a three species ecosystem. The system consists of three species, represented by red patches, green patches, and blue patches, which compete over space. The interactions between the species are based on the game Rock-Paper-Scissors. That is, red beats green, green beats blue, and blue beats red. Organisms compete with their neighbors, move throughout the environment, and reproduce. These interactions result in spiral patterns whose size and stability depends on the movement rate of the organisms.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/wolfsheep/index.html Wolf Sheep Predation]
:NetLogo Model. A population of sheep that wander around the landscape. For each step the sheep take it costs them some energy and if there energy gets too low they die. However, the sheep can eat grass in the environment to regain energy and the grass regrows over time. If the energy of the sheep gets above a certain level then they can reproduce. There are also wolves that have the same behaviors as sheep except for eating; rather than grass, they eat sheep.

* [https://94803ca8ae7275c8ec82-af69fe8046cb86ce613bfe795f3569f4.ssl.cf1.rackcdn.com/NumerusOL/WebKit/wvmach/index.html Wave Machine]
:Netlogo Model. This model simulates wave motion in a membrane. The four edges of the membrane are fixed to a frame. A green rectangular area represents a driver plate that moves up and down, exhibiting sinusoidal motion.