JSX Trigonometrische Funktionen
Aus Wiki1
(Unterschied zwischen Versionen)
Zeile 1: | Zeile 1: | ||
Mit Hilfe des Programmpakets JSXGraph (siehe http://jsxgraph.uni-bayreuth.de/wp/) können komplexe, interaktive Grafiken nur mit Hilfe von JavaScript in Webseiten integriert werden. Hier ein Beispiel zur Darstellung der Trigonometrischen Funktionen (der rote Punkt kann mit der Maus bewegt werden!): | Mit Hilfe des Programmpakets JSXGraph (siehe http://jsxgraph.uni-bayreuth.de/wp/) können komplexe, interaktive Grafiken nur mit Hilfe von JavaScript in Webseiten integriert werden. Hier ein Beispiel zur Darstellung der Trigonometrischen Funktionen (der rote Punkt kann mit der Maus bewegt werden!): | ||
- | < | + | <jsxgraph box="jxgbox1" width="700" height="300"> |
- | + | board1 = JXG.JSXGraph.initBoard('jxgbox1', {axis:true, boundingbox: [-6, 3, 8, -3]}); | |
- | + | board1.suspendUpdate(); | |
- | + | board1.create('functiongraph', [function(t){ return Math.sin(t); },-10, 10],{strokeColor: "#cccccc"}); | |
- | + | var s = board1.create('slider', [[0.75,-1.5],[5.75,-1.5],[0,0,10]], {name:'S',snapWidth:1}); | |
- | + | board1.create('functiongraph', [ | |
- | + | function(t) { | |
- | + | var val = 0, i, sv = s.Value()+1; | |
- | + | for(i = 0; i < sv; i++) { | |
- | + | val = val + Math.pow(-1, i) * Math.pow(t, 2 * i + 1) / JXG.Math.factorial(2*i+1); | |
- | + | } | |
- | + | return val; | |
- | + | }, | |
- | + | -10, 10], {strokeColor: "#bb0000"}); | |
- | + | board1.unsuspendUpdate(); | |
- | + | </jsxgraph> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
<code javascript> | <code javascript> | ||
- | + | board1 = JXG.JSXGraph.initBoard('jxgbox1', {axis:true, boundingbox: [-6, 3, 8, -3]}); | |
- | + | board1.suspendUpdate(); | |
- | + | board1.create('functiongraph', [function(t){ return Math.sin(t); },-10, 10],{strokeColor: "#cccccc"}); | |
- | + | var s = board1.create('slider', [[0.75,-1.5],[5.75,-1.5],[0,0,10]], {name:'S',snapWidth:1}); | |
- | + | board1.create('functiongraph', [ | |
- | + | function(t) { | |
- | + | var val = 0, i, sv = s.Value()+1; | |
- | + | for(i = 0; i < sv; i++) { | |
- | + | val = val + Math.pow(-1, i) * Math.pow(t, 2 * i + 1) / JXG.Math.factorial(2*i+1); | |
- | + | } | |
- | + | return val; | |
- | + | }, -10, 10], {strokeColor: "#bb0000"}); | |
- | + | board1.unsuspendUpdate(); | |
- | + | </code> | |
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | + | == Power Series for Cosine == | |
- | </ | + | <jsxgraph box="jxgbox2" width="700" height="300"> |
+ | board2 = JXG.JSXGraph.initBoard('jxgbox2', {axis:true, boundingbox: [-6, 3, 8, -3]}); | ||
+ | board2.suspendUpdate(); | ||
+ | board2.create('functiongraph', [function(t){ return Math.cos(t); }, -10, 10],{strokeColor: "#cccccc"}); | ||
+ | var s2 = board2.create('slider', [[0.75,-1.5],[5.75,-1.5],[0,0,10]], {name:'T',snapWidth:1}); | ||
+ | board2.create('functiongraph', [ | ||
+ | function(t) { | ||
+ | var val = 0, i, sv = s2.Value()+1; | ||
+ | for(i = 0; i < sv; i++) { | ||
+ | val = val + Math.pow(-1, i) * Math.pow(t, 2 * i) / JXG.Math.factorial(2*i); | ||
+ | } | ||
+ | return val; | ||
+ | }, | ||
+ | -10, 10],{strokeColor: "#009900"}); | ||
+ | board2.unsuspendUpdate(); | ||
+ | </jsxgraph> | ||
[[Kategorie:Bilder]] | [[Kategorie:Bilder]] | ||
[[Kategorie:Wissen]] | [[Kategorie:Wissen]] |
Version vom 19:56, 23. Nov. 2013
Mit Hilfe des Programmpakets JSXGraph (siehe http://jsxgraph.uni-bayreuth.de/wp/) können komplexe, interaktive Grafiken nur mit Hilfe von JavaScript in Webseiten integriert werden. Hier ein Beispiel zur Darstellung der Trigonometrischen Funktionen (der rote Punkt kann mit der Maus bewegt werden!):
board1 = JXG.JSXGraph.initBoard('jxgbox1', {axis:true, boundingbox: [-6, 3, 8, -3]});
board1.suspendUpdate();
board1.create('functiongraph', [function(t){ return Math.sin(t); },-10, 10],{strokeColor: "#cccccc"});
var s = board1.create('slider', [[0.75,-1.5],[5.75,-1.5],[0,0,10]], {name:'S',snapWidth:1});
board1.create('functiongraph', [
function(t) { var val = 0, i, sv = s.Value()+1; for(i = 0; i < sv; i++) { val = val + Math.pow(-1, i) * Math.pow(t, 2 * i + 1) / JXG.Math.factorial(2*i+1); } return val; }, -10, 10], {strokeColor: "#bb0000"});
board1.unsuspendUpdate();