Team:Amsterdam/shadow/modeling/model1

From 2012.igem.org

(Difference between revisions)
Line 6: Line 6:
charset=iso-8859-1" />
charset=iso-8859-1" />
<title>iGEM Amsterdam: Cell Logbook</title>
<title>iGEM Amsterdam: Cell Logbook</title>
 +
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
 +
<script type="text/javascript" src="https://dl-web.dropbox.com/get/numeric.js?w=f4425ad6"></script>
 +
<script type="text/javascript">
 +
function difEqPlot(m){
 +
f = function(t,x) {
 +
  return [m*(x[1]-x[0]),
 +
          x[0]*(28-x[2])-x[1],
 +
          x[0]*x[1]-(8/3)*x[2]];
 +
}
 +
sol = numeric.dopri(0,20,[-1,3,4],f,1e-6,2000);
 +
soly = numeric.transpose(sol.y);
 +
 +
$(function () {
 +
    var chart;
 +
    $(document).ready(function() {
 +
        chart = new Highcharts.Chart({
 +
            chart: {
 +
                renderTo: 'container',
 +
                type: 'line',
 +
                marginRight: 130,
 +
                marginBottom: 25
 +
            },
 +
            title: {
 +
                text: 'Testing Interactive Models',
 +
                x: -20 //center
 +
            },
 +
            subtitle: {
 +
                text: 'Source: iGEM Amsterdam 2012',
 +
                x: -20
 +
            },
 +
            xAxis: {
 +
                title: {
 +
                    text: 'x-axis'
 +
                },
 +
            },
 +
            yAxis: {
 +
                title: {
 +
                    text: 'y-axis'
 +
                },
 +
                plotLines: [{
 +
                    value: 0,
 +
                    width: 1,
 +
                    color: '#808080'
 +
                }]
 +
            },
 +
            tooltip: {
 +
                formatter: function() {
 +
                        return '<b>'+ this.series.name +'</b><br/>'+
 +
                        this.x +': '+ this.y +'�C';
 +
                }
 +
            },
 +
            legend: {
 +
                layout: 'vertical',
 +
                align: 'right',
 +
                verticalAlign: 'top',
 +
                x: -10,
 +
                y: 100,
 +
                borderWidth: 0
 +
            },
 +
            series: [{
 +
                name: 'Differential Equation 1',
 +
                data: sol.y
 +
 +
            }]
 +
        });
 +
    });
 +
   
 +
});
 +
}
 +
</script>
 +
<script type="text/javascript">
 +
difEqPlot(10)
 +
</script>
 +
<script type="text/javascript">
 +
function resubmitDifEqPlot(){
 +
m = document.myForm.myText.value
 +
difEqPlot(m)
 +
}
 +
</script>
</head>
</head>
<body>
<body>
<div id="centerContent">
<div id="centerContent">
<p>
<p>
 +
<form name="myForm">
 +
    Please Enter a number and click the submit button<br>
 +
      <input type=TEXT value="10" name="myText">
 +
      <input type=BUTTON value="Submit" name="mySubmit" onClick="resubmitDifEqPlot()">
 +
    </form>
 +
<script src="http://code.highcharts.com/highcharts.js"></script><script src="http://code.highcharts.com/modules/exporting.js"></script>
 +
 +
 +
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
</p>
</p>
</div>
</div>

Revision as of 09:09, 20 June 2012

Test page

iGEM Amsterdam: Cell Logbook

Please Enter a number and click the submit button