Difference between revisions of "Inverse Composition Rules"

From JSXGraph Wiki
Jump to navigationJump to search
Line 37: Line 37:
 
   <td><input type="radio" name="g" value="asinh"        onChange="change(this)"></td>
 
   <td><input type="radio" name="g" value="asinh"        onChange="change(this)"></td>
 
   <td><input type="radio" name="g" value="log"          onChange="change(this)"></td>
 
   <td><input type="radio" name="g" value="log"          onChange="change(this)"></td>
 +
</tr>
 +
<tr>
 +
  <th>Composition</th>
 +
  <td>f(g(x)</td>
 +
  <td>g(f(x)</td>
 +
  <td>&nbsp;</td>
 +
  <td>&nbsp;</td>
 +
  <td>&nbsp;</td>
 +
  <td>&nbsp;</td>
 +
</tr>
 +
<tr>
 +
  <td>&nbsp;</td>
 +
  <td><input type="radio" name="g" value="fg" checked onChange="comp(this)"></td>
 +
  <td><input type="radio" name="g" value="gf"        onChange="comp(this)"></td>
 +
  <td>&nbsp;</td>
 +
  <td>&nbsp;</td>
 +
  <td>&nbsp;</td>
 +
  <td>&nbsp;</td>
 
  </tr>
 
  </tr>
 
</table>
 
</table>
Line 43: Line 61:
 
<jsxgraph width="600" height="600" box="box">
 
<jsxgraph width="600" height="600" box="box">
 
var brd = JXG.JSXGraph.initBoard('box', {axis:true, originX: 300, originY: 300, grid:true, unitX: 50, unitY: 50});
 
var brd = JXG.JSXGraph.initBoard('box', {axis:true, originX: 300, originY: 300, grid:true, unitX: 50, unitY: 50});
var f, g;
+
var f, g, fg;
  
 
var change = function(obj) {
 
var change = function(obj) {
Line 61: Line 79:
 
  } else if (t=='log')    { g = function(x) { return Math.log(x); }
 
  } else if (t=='log')    { g = function(x) { return Math.log(x); }
 
  }
 
  }
alert(f.toString());
 
 
  plotf.Y = f; plotf.updateCurve();
 
  plotf.Y = f; plotf.updateCurve();
 
  plotg.Y = g; plotg.updateCurve();
 
  plotg.Y = g; plotg.updateCurve();
 +
brd.update();
 +
}
 +
 +
var comp = function(obj) {
 +
var t = obj.value;
 +
if (t=='fg')          { fg = function(x) { return f(g(x)); }
 +
} else if (t=='gf')    { fg = function(x) { return g(f(x)); }
 +
plotfg.Y = fg; plotfg.updateCurve();
 
  brd.update();
 
  brd.update();
 
}
 
}
Line 69: Line 94:
 
f = function(x) { return Math.sin(x); }
 
f = function(x) { return Math.sin(x); }
 
g = function(x) { return Math.asin(x); }
 
g = function(x) { return Math.asin(x); }
 +
fg = function(x) { return Math.sin(Math.asin(x)); }
  
 
plotf = brd.createElement('functiongraph',[f,-2,2],{dash:2});
 
plotf = brd.createElement('functiongraph',[f,-2,2],{dash:2});
 
plotg = brd.createElement('functiongraph',[g,-2,2],{dash:3, strokeColor:'black'});
 
plotg = brd.createElement('functiongraph',[g,-2,2],{dash:3, strokeColor:'black'});
 +
plotfg = brd.createElement('functiongraph',[fg,-2,2],{strokeColor:'red'});
  
 
</jsxgraph>
 
</jsxgraph>

Revision as of 15:43, 19 June 2009

f(x) sin(x) cos(x) tan(x) x2 sinh(x) exp(x)
 
g(x) arcsin(x) arccos(x) arctan(x) √(x) arcsinh(x) log(x)
 
Composition f(g(x) g(f(x)        
         

The underlying JavaScript code