Difference between revisions of "Draggable exponential function"

From JSXGraph Wiki
Jump to: navigation, search
 
(5 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
Plot the function
 
Plot the function
$$y = e^{ax}$$
+
:<math> y = e^{ax}</math>
where the parameter ''a'' is determined by the Point ''A=(x_A, x_Y)''.
+
where the parameter <math>a</math> is determined by the Point <math>A=(x_A, y_A)</math>.
 +
 
 +
That means,
 +
:<math> a = log(y_A) / x_A </math>
 +
 
 
<jsxgraph width="400" height="400" box="box1">
 
<jsxgraph width="400" height="400" box="box1">
var board = JXG.JSXGraph.initBoard('box1', {boundingbox: [-5, 20, 5, -1], axis:true});
+
var board = JXG.JSXGraph.initBoard('box1', {boundingbox: [-5, 20, 5, -2], axis:true});
  
var p = board.create('point', [1, Math.exp(1)]);
+
var A = board.create('point', [1, Math.exp(1)]);
 
var graph = board.create('functiongraph', [
 
var graph = board.create('functiongraph', [
 
         function(x) {
 
         function(x) {
             var a = Math.log(p.Y()) / p.X();
+
             var a = Math.log(A.Y()) / A.X();
 
             return Math.exp(a * x);
 
             return Math.exp(a * x);
 
         }]);
 
         }]);
 
            
 
            
 
var txt = board.create('text', [-3, 10, function () {
 
var txt = board.create('text', [-3, 10, function () {
           return "a = " + (Math.log(p.Y()) / p.X()).toFixed(2);
+
           return "a = " + (Math.log(A.Y()) / A.X()).toFixed(2);
 
           }], {fontSize: 16});
 
           }], {fontSize: 16});
 
</jsxgraph>
 
</jsxgraph>
 
+
<html>
 +
<input type="button" onClick="alert('a = ' + (Math.log(A.Y()) / A.X()).toFixed(2))" value="Show value of a" />
 +
</html>
  
 
===The JavaScript code===
 
===The JavaScript code===
 
<source lang="javascript">
 
<source lang="javascript">
var board = JXG.JSXGraph.initBoard('box1', {boundingbox: [-5, 20, 5, -1], axis:true});
+
var board = JXG.JSXGraph.initBoard('box1', {boundingbox: [-5, 20, 5, -2], axis:true});
  
var p = board.create('point', [1, Math.exp(1)]);
+
var A = board.create('point', [1, Math.exp(1)]);
 
var graph = board.create('functiongraph', [
 
var graph = board.create('functiongraph', [
 
         function(x) {
 
         function(x) {
             var a = Math.log(p.Y()) / p.X();
+
             var a = Math.log(A.Y()) / A.X();
 
             return Math.exp(a * x);
 
             return Math.exp(a * x);
 
         }]);
 
         }]);
 
            
 
            
 
var txt = board.create('text', [-3, 10, function () {
 
var txt = board.create('text', [-3, 10, function () {
           return "a = " + (Math.log(p.Y()) / p.X()).toFixed(2);
+
           return "a = " + (Math.log(A.Y()) / A.X()).toFixed(2);
 
           }], {fontSize: 16});
 
           }], {fontSize: 16});
 +
</source>
 +
 +
<source lang="html4strict">
 +
<input type="button" onClick="alert('a = ' + (Math.log(A.Y()) / A.X()).toFixed(2))" value="Show value of a" />
 
</source>
 
</source>
  
 
[[Category:Examples]]
 
[[Category:Examples]]
 
[[Category:Calculus]]
 
[[Category:Calculus]]

Latest revision as of 10:41, 16 February 2016

Plot the function

[math] y = e^{ax}[/math]

where the parameter [math]a[/math] is determined by the Point [math]A=(x_A, y_A)[/math].

That means,

[math] a = log(y_A) / x_A [/math]

The JavaScript code

var board = JXG.JSXGraph.initBoard('box1', {boundingbox: [-5, 20, 5, -2], axis:true});

var A = board.create('point', [1, Math.exp(1)]);
var graph = board.create('functiongraph', [
         function(x) {
            var a = Math.log(A.Y()) / A.X();
            return Math.exp(a * x);
         }]);
           
var txt = board.create('text', [-3, 10, function () {
           return "a = " + (Math.log(A.Y()) / A.X()).toFixed(2);
          }], {fontSize: 16});
<input type="button" onClick="alert('a = ' + (Math.log(A.Y()) / A.X()).toFixed(2))" value="Show value of a" />