JSXGraph
JSXGraph share

Share

SIR model: swine flu
Show plain example
QR code 
<iframe 
    src="https://jsxgraph.org/share/iframe/sir-model-swine-flu" 
    style="border: 1px solid black; overflow: hidden; width: 550px; aspect-ratio: 55 / 65;" 
    name="JSXGraph example: SIR model: swine flu" 
    allowfullscreen
></iframe>
This code has to 
<input type="button" value="clear and run a simulation of 200 days" onClick="clearturtle();run()">
<input type="button" value="stop" onClick="stop()">
<input type="button" value="continue" onClick="goOn()">

<div id="board-0-wrapper" class="jxgbox-wrapper " style="width: 100%; ">
   <div id="board-0" class="jxgbox" style="aspect-ratio: 1 / 1; width: 100%;" data-ar="1 / 1"></div>
</div>

<script type = "text/javascript"> 
    /*
    This example is licensed under a 
    Creative Commons Attribution ShareAlike 4.0 International License.
    https://creativecommons.org/licenses/by-sa/4.0/
    
    Please note you have to mention 
    The Center of Mobile Learning with Digital Technology
    in the credits.
    */
    
    const BOARDID = 'board-0';

    var board = JXG.JSXGraph.initBoard(BOARDID, { boundingbox: [-6.66, 1.2, 226.66, -0.8], axis: true });
    
    var S = board.create('turtle', [], { strokeColor: 'blue', strokeWidth: 3 });
    var I = board.create('turtle', [], { strokeColor: 'red', strokeWidth: 3 });
    var R = board.create('turtle', [], { strokeColor: 'green', strokeWidth: 3 });
    
    var s = board.create('slider', [[0, -0.3], [60, -0.3], [0, 1E-6, 1]], { name: 's' });
    var beta = board.create('slider', [[0, -0.4], [60, -0.4], [0, 0.2857, 1]], { name: 'β' });
    var gamma = board.create('slider', [[0, -0.5], [60, -0.5], [0, 0.1428, 0.5]], { name: 'γ' });
    var mort = board.create('slider', [[0, -0.6], [60, -0.6], [0, 0.4, 10.0]], { name: '% mortality' });
    board.create('text', [90, -0.3, "initially infected population rate"]);
    board.create('text', [90, -0.4, function() {
        return "β: infection rate, R<sub>0</sub>=" + (beta.Value() / gamma
            .Value()).toFixed(2);
    }]);
    board.create('text', [90, -0.5,
    function() {
            return "γ: recovery rate = 1/(days of infection), days of infection= " + (1 / gamma.Value())
                .toFixed(1);
        }]);
    
    var t = 0; // global
    
    board.create('text', [100, -0.2,
            function() {
            return "Day " + t +
                ": infected=" + (1000000 * I.Y()).toFixed(1) +
                " recovered=" + (1000000 * R.Y()).toFixed(1) +
                " dead=" + (1000000 * R.Y() * mort.Value() * 0.01).toFixed(0);
        }]);
    
    S.hideTurtle();
    I.hideTurtle();
    R.hideTurtle();
    
    function clearturtle() {
        S.cs();
        I.cs();
        R.cs();
    
        S.hideTurtle();
        I.hideTurtle();
        R.hideTurtle();
    }
    
    function run() {
        S.setPos(0, 1.0 - s.Value());
        R.setPos(0, 0);
        I.setPos(0, s.Value());
    
        delta = 1; // global
        t = 0; // global
        loop();
    }
    
    function turtleMove(turtle, dx, dy) {
        turtle.moveTo([dx + turtle.X(), dy + turtle.Y()]);
    }
    
    function loop() {
        var dS = -beta.Value() * S.Y() * I.Y();
        var dR = gamma.Value() * I.Y();
        var dI = -(dS + dR);
        turtleMove(S, delta, dS);
        turtleMove(R, delta, dR);
        turtleMove(I, delta, dI);
    
        t += delta;
        if (t < 200.0) {
            active = setTimeout(loop, 10);
        }
    }
    
    function stop() {
        if (active) clearTimeout(active);
        active = null;
    }
    
    function goOn() {
        if (t > 0) {
            if (active == null) {
                active = setTimeout(loop, 10);
            }
        } else {
            run();
        }
    
    }
 </script> 
/*
This example is licensed under a 
Creative Commons Attribution ShareAlike 4.0 International License.
https://creativecommons.org/licenses/by-sa/4.0/

Please note you have to mention 
The Center of Mobile Learning with Digital Technology
in the credits.
*/

const BOARDID = 'your_div_id'; // Insert your id here!

var board = JXG.JSXGraph.initBoard(BOARDID, { boundingbox: [-6.66, 1.2, 226.66, -0.8], axis: true });

var S = board.create('turtle', [], { strokeColor: 'blue', strokeWidth: 3 });
var I = board.create('turtle', [], { strokeColor: 'red', strokeWidth: 3 });
var R = board.create('turtle', [], { strokeColor: 'green', strokeWidth: 3 });

var s = board.create('slider', [[0, -0.3], [60, -0.3], [0, 1E-6, 1]], { name: 's' });
var beta = board.create('slider', [[0, -0.4], [60, -0.4], [0, 0.2857, 1]], { name: 'β' });
var gamma = board.create('slider', [[0, -0.5], [60, -0.5], [0, 0.1428, 0.5]], { name: 'γ' });
var mort = board.create('slider', [[0, -0.6], [60, -0.6], [0, 0.4, 10.0]], { name: '% mortality' });
board.create('text', [90, -0.3, "initially infected population rate"]);
board.create('text', [90, -0.4, function() {
    return "β: infection rate, R<sub>0</sub>=" + (beta.Value() / gamma
        .Value()).toFixed(2);
}]);
board.create('text', [90, -0.5,
function() {
        return "γ: recovery rate = 1/(days of infection), days of infection= " + (1 / gamma.Value())
            .toFixed(1);
    }]);

var t = 0; // global

board.create('text', [100, -0.2,
        function() {
        return "Day " + t +
            ": infected=" + (1000000 * I.Y()).toFixed(1) +
            " recovered=" + (1000000 * R.Y()).toFixed(1) +
            " dead=" + (1000000 * R.Y() * mort.Value() * 0.01).toFixed(0);
    }]);

S.hideTurtle();
I.hideTurtle();
R.hideTurtle();

function clearturtle() {
    S.cs();
    I.cs();
    R.cs();

    S.hideTurtle();
    I.hideTurtle();
    R.hideTurtle();
}

function run() {
    S.setPos(0, 1.0 - s.Value());
    R.setPos(0, 0);
    I.setPos(0, s.Value());

    delta = 1; // global
    t = 0; // global
    loop();
}

function turtleMove(turtle, dx, dy) {
    turtle.moveTo([dx + turtle.X(), dy + turtle.Y()]);
}

function loop() {
    var dS = -beta.Value() * S.Y() * I.Y();
    var dR = gamma.Value() * I.Y();
    var dI = -(dS + dR);
    turtleMove(S, delta, dS);
    turtleMove(R, delta, dR);
    turtleMove(I, delta, dI);

    t += delta;
    if (t < 200.0) {
        active = setTimeout(loop, 10);
    }
}

function stop() {
    if (active) clearTimeout(active);
    active = null;
}

function goOn() {
    if (t > 0) {
        if (active == null) {
            active = setTimeout(loop, 10);
        }
    } else {
        run();
    }

}
The **SIR model** (see also [[Epidemiology: The SIR model]]) tries to predict influenza epidemics. Here, we try to model the spreading of the **H1N1 virus**, aka swine flu. - According to the [CDC Centers of Disease Control and Prevention](http://www.cdc.gov/): > "Adults shed influenza virus from the day before symptoms begin through 5–10 days after illness onset. However, the amount of virus shed, and presumably infectivity, decreases rapidly by 3–5 days after onset in an experimental human infection model." So, here we set $\gamma = \tfrac{1}{7} = 0.1428$ as the recovery rate. This means, on average an infected person sheds the virus for 7 days. - In [*Modeling influenza epidemics and pandemics: insights into the future of swine flu (H1N1)*](http://www.pubmedcentral.nih.gov/articlerender.fcgi?artid=2715422) the authors estimate the reproduction rate $R_0$ of the virus to be about $2$. For the SIR model this means: the reproduction rate $R_0$ for influenza is equal to the infection rate of the strain ($\beta$) multiplied by the duration of the infectious period ($1/\gamma$), i.e. $\beta = R_0 \cdot \gamma$. Therefore, we set $\beta = 2 \cdot \tfrac{1}{7} = 0.2857$. For the 1918–1919 pandemic $R_0$ is estimated to be between **2 and 3**, whereas for the seasonal flu the range for $R_0$ is **0.9 to 2.1**. - In [New Scientist](http://www.newscientist.com/article/dn17109-first-analysis-of-swine-flu-spread-supports-pandemic-plan.html), the mortality is estimated to be approximately **0.4%**. - We run the simulation for a population of **1 million people**, where **1 person is infected initially**, i.e. $s = 1 \cdot 10^{-6}$. Thus, $S(0) = 1$, $I(0) = 1.0 \cdot 10^{-6}$, $R(0) = 0$. The lines in the JSXGraph-simulation below have the following meaning: - **Blue:** Rate of susceptible population - **Red:** Rate of infected population - **Green:** Rate of recovered population 
<input type="button" value="clear and run a simulation of 200 days" onClick="clearturtle();run()">
<input type="button" value="stop" onClick="stop()">
<input type="button" value="continue" onClick="goOn()">
// Define the id of your board in BOARDID

var board = JXG.JSXGraph.initBoard(BOARDID, { boundingbox: [-6.66, 1.2, 226.66, -0.8], axis: true });

var S = board.create('turtle', [], { strokeColor: 'blue', strokeWidth: 3 });
var I = board.create('turtle', [], { strokeColor: 'red', strokeWidth: 3 });
var R = board.create('turtle', [], { strokeColor: 'green', strokeWidth: 3 });

var s = board.create('slider', [[0, -0.3], [60, -0.3], [0, 1E-6, 1]], { name: 's' });
var beta = board.create('slider', [[0, -0.4], [60, -0.4], [0, 0.2857, 1]], { name: 'β' });
var gamma = board.create('slider', [[0, -0.5], [60, -0.5], [0, 0.1428, 0.5]], { name: 'γ' });
var mort = board.create('slider', [[0, -0.6], [60, -0.6], [0, 0.4, 10.0]], { name: '% mortality' });
board.create('text', [90, -0.3, "initially infected population rate"]);
board.create('text', [90, -0.4, function() {
    return "β: infection rate, R<sub>0</sub>=" + (beta.Value() / gamma
        .Value()).toFixed(2);
}]);
board.create('text', [90, -0.5,
function() {
        return "γ: recovery rate = 1/(days of infection), days of infection= " + (1 / gamma.Value())
            .toFixed(1);
    }]);

var t = 0; // global

board.create('text', [100, -0.2,
        function() {
        return "Day " + t +
            ": infected=" + (1000000 * I.Y()).toFixed(1) +
            " recovered=" + (1000000 * R.Y()).toFixed(1) +
            " dead=" + (1000000 * R.Y() * mort.Value() * 0.01).toFixed(0);
    }]);

S.hideTurtle();
I.hideTurtle();
R.hideTurtle();

function clearturtle() {
    S.cs();
    I.cs();
    R.cs();

    S.hideTurtle();
    I.hideTurtle();
    R.hideTurtle();
}

function run() {
    S.setPos(0, 1.0 - s.Value());
    R.setPos(0, 0);
    I.setPos(0, s.Value());

    delta = 1; // global
    t = 0; // global
    loop();
}

function turtleMove(turtle, dx, dy) {
    turtle.moveTo([dx + turtle.X(), dy + turtle.Y()]);
}

function loop() {
    var dS = -beta.Value() * S.Y() * I.Y();
    var dR = gamma.Value() * I.Y();
    var dI = -(dS + dR);
    turtleMove(S, delta, dS);
    turtleMove(R, delta, dR);
    turtleMove(I, delta, dI);

    t += delta;
    if (t < 200.0) {
        active = setTimeout(loop, 10);
    }
}

function stop() {
    if (active) clearTimeout(active);
    active = null;
}

function goOn() {
    if (t > 0) {
        if (active == null) {
            active = setTimeout(loop, 10);
        }
    } else {
        run();
    }

}

license

This example is licensed under a Creative Commons Attribution ShareAlike 4.0 International License.
Please note you have to mention The Center of Mobile Learning with Digital Technology in the credits.