Difference between revisions of "Approximation of e"

From JSXGraph Wiki
Jump to navigationJump to search
 
(8 intermediate revisions by the same user not shown)
Line 1: Line 1:
 +
This little animation approximates <math>e</math> (displayed by the horizontal green line) by the sequence (blue line)
 +
:<math>(1+\frac{1}{n})^n</math>
 +
and by the series (black line)
 +
:<math> \sum_{n=0}^\infty \frac{1}{n!} </math>
 +
 +
 
<jsxgraph width="500" height="500" box="box">
 
<jsxgraph width="500" height="500" box="box">
 
(function(){
 
(function(){
  
  var board = JXG.JSXGraph.initBoard('box', {axis:true, boundingbox: [-10, 3, 10, 0.5]});
+
  var board = JXG.JSXGraph.initBoard('box', {axis:true, boundingbox: [-3, 3, 50, 0.5]});
 
  var line = board.create('line', [[-10, Math.E], [100, Math.E]], {strokeColor: 'green', strokeWidth: 1});
 
  var line = board.create('line', [[-10, Math.E], [100, Math.E]], {strokeColor: 'green', strokeWidth: 1});
 
  var seq = board.create('curve', [[0], [1]], {strokeColor: 'blue'});
 
  var seq = board.create('curve', [[0], [1]], {strokeColor: 'blue'});
Line 21: Line 27:
 
     series.dataY.push(val);
 
     series.dataY.push(val);
 
  };
 
  };
 +
 +
var txt1 = board.create('text', [15, 1.6, function() { return 'n=' + (seq.dataX.length-1) + ': value = ' + seq.dataY[seq.dataY.length - 1]; }], {strokeColor: 'blue'});
 +
var txt2 = board.create('text', [15, 1.8, function() { return 'n=' + (series.dataX.length-1) + ': value = ' + series.dataY[series.dataY.length - 1]; }], {strokeColor: 'black'});
  
 
  var approx = function() {
 
  var approx = function() {
Line 26: Line 35:
 
     series_add();
 
     series_add();
 
     board.update();
 
     board.update();
 +
    if (seq.dataX.length <= 50) {
 +
        setTimeout(approx, 500);
 +
    }
 
  }
 
  }
  
 
+
  approx();
  setInterval(approx, 500);
 
  
 
})();
 
})();
 
</jsxgraph>
 
</jsxgraph>
 +
 +
=== The underlying JavaScript code ===
 +
<source lang="javascript">
 +
var board = JXG.JSXGraph.initBoard('box', {axis:true, boundingbox: [-3, 3, 50, 0.5]});
 +
var line = board.create('line', [[-10, Math.E], [100, Math.E]], {strokeColor: 'green', strokeWidth: 1});
 +
var seq = board.create('curve', [[0], [1]], {strokeColor: 'blue'});
 +
 +
var seq_add = function() {
 +
    var n = seq.dataX.length,
 +
        val = Math.pow(1 + 1/n, n);
 +
    seq.dataX.push(n);
 +
    seq.dataY.push(val);
 +
};
 +
 +
var series = board.create('curve', [[0], [1]], {strokeColor: 'black'});
 +
 +
var series_add = function() {
 +
    var n = series.dataX.length,
 +
        val = series.dataY[n - 1] + 1 / JXG.Math.factorial(n);
 +
    series.dataX.push(n);
 +
    series.dataY.push(val);
 +
};
 +
 +
var txt1 = board.create('text', [15, 1.6, function() { return 'n=' + (seq.dataX.length-1) + ': value = ' + seq.dataY[seq.dataY.length - 1]; }], {strokeColor: 'blue'});
 +
var txt2 = board.create('text', [15, 1.8, function() { return 'n=' + (series.dataX.length-1) + ': value = ' + series.dataY[series.dataY.length - 1]; }], {strokeColor: 'black'});
 +
 +
var approx = function() {
 +
    seq_add();
 +
    series_add();
 +
    board.update();
 +
    if (seq.dataX.length <= 50) {
 +
        setTimeout(approx, 500);
 +
    }
 +
}
 +
 +
approx();
 +
 +
</source>
 +
 +
[[Category:Examples]]
 +
[[Category:Calculus]]

Latest revision as of 00:18, 7 January 2019

This little animation approximates [math]e[/math] (displayed by the horizontal green line) by the sequence (blue line)

[math](1+\frac{1}{n})^n[/math]

and by the series (black line)

[math] \sum_{n=0}^\infty \frac{1}{n!} [/math]


The underlying JavaScript code

 var board = JXG.JSXGraph.initBoard('box', {axis:true, boundingbox: [-3, 3, 50, 0.5]});
 var line = board.create('line', [[-10, Math.E], [100, Math.E]], {strokeColor: 'green', strokeWidth: 1});
 var seq = board.create('curve', [[0], [1]], {strokeColor: 'blue'});
 
 var seq_add = function() {
    var n = seq.dataX.length,
        val = Math.pow(1 + 1/n, n);
    seq.dataX.push(n);
    seq.dataY.push(val);
 };

 var series = board.create('curve', [[0], [1]], {strokeColor: 'black'});
 
 var series_add = function() {
    var n = series.dataX.length,
        val = series.dataY[n - 1] + 1 / JXG.Math.factorial(n);
    series.dataX.push(n);
    series.dataY.push(val);
 };

 var txt1 = board.create('text', [15, 1.6, function() { return 'n=' + (seq.dataX.length-1) + ': value = ' + seq.dataY[seq.dataY.length - 1]; }], {strokeColor: 'blue'});
 var txt2 = board.create('text', [15, 1.8, function() { return 'n=' + (series.dataX.length-1) + ': value = ' + series.dataY[series.dataY.length - 1]; }], {strokeColor: 'black'});

 var approx = function() {
     seq_add();
     series_add();
     board.update();
     if (seq.dataX.length <= 50) {
         setTimeout(approx, 500);
     }
 }

 approx();