Simulator

Hsim description

Wiki-integrated simulator

A simulation graph is worth a thousand words. But an integrated, user-controllable online simulator is worth a million.

Explanation

In order to make our models easier to understand, we have created an on-line simulator fully integrated in the iGEM wiki system. This simulator uses the aforementioned HSIM rules and implements one of the HSIM algorithms that can be summed up as the following series of steps :

Randomly reorder the reaction list
Compute the number of reactions to execute : R. R is a decimal number proportional to the concentrations, the reaction probability, and a constant factor α.
Execute the reaction integer part of R times
Execute it one more time with the probability decimal part of R

See the reference article for more details.

This self-contained simulator is written in standard HTML5 and is therefore compatible with the iGEM 2013 rules which forbid the embedding of plug-ins and external data.

How to control the simulator

Our wiki-based simulator in action

The simulator is easy to use. The graph represents the live quantities of the different molecules as a function of time. The line color for each molecule is shown just below the graph. The controllable quantities involved in the simulation also appear under the graph. Finally, there are two control buttons : START and RESET.

In order to launch a simulation, you can press START. To pause it, click on this same button again. Another click will resume the simulation. While the simulation is paused, you can modify the controllable quantities. If you want to reset the simulation to its initial state and default molecule quantities, just click on the RESET button.

You can launch the simulator associated with our modeling of the [Paris_Saclay/Modeling/FNR oxygen sensor] system.

How to include this simulator in your wiki

Our simulator is designed to be simple to use. You can embed your own by following these steps :

First upload a copy of our script available here : HTML5 simulator code
Then insert the script one time at the beginning of each page where you want to use the simulator :

<script src="http://YEAR.igem.org/Team:TEAM/simbox.js?action=raw&ctype=text/javascript"></script>

For each simulation, create an XML configuration page. The syntax is the following :

<?xml version="1.0" encoding="ISO-8859-1"?>
<sim>
<yscale>1300</yscale>

<volume>0.7</volume> <!-- 0.7 cubic micrometers -->
<timestep>0.0001</timestep> <!-- seconds -->
<alpha>7.4e-7</alpha> <!-- alpha -->

<!-- DECLARATION OF THE MOLECULES -->

<molecule name="A" quantity="1000" curve_show="true" curve_color="#FF0000" adjustable="true"/>
<molecule name="B" quantity="1000" curve_show="true" curve_color="#0000FF"/>
<molecule name="C" curve_show="true" curve_color="#FF00FF"/>

<!-- DECLARATION OF THE REACTIONS -->

<!-- A + B -> C -->
<reaction probability="0.1">
 <in>A</in>
 <in>B</in>
 <out>C</out>
</reaction>

<!-- A -> B + C -->
<reaction probability="0.0001">
 <in>A</in>
 <out>B</out>
 <out>C</out>
</reaction>

</sim>

Finally, include the simulator in your page :

<html>
<div class="simbox" data-width="785" data-height="300" data-load="URL_OF_YOUR_XML_PAGE">
Loading simulation...
</div>
</html>

Article written by Zhou

Team:Paris Saclay/Modeling/Simulator

From 2013.igem.org

Contents