JSX Trigonometrische Funktionen

Aus Wiki1

(Unterschied zwischen Versionen)
Wechseln zu: Navigation, Suche
Zeile 3: Zeile 3:
<jsxgraph width="600" height="600" box="box">
<jsxgraph width="600" height="600" box="box">
var brd = JXG.JSXGraph.initBoard('box', {originX: 300, originY: 300, grid:true, unitX: 100, unitY: 100});
var brd = JXG.JSXGraph.initBoard('box', {originX: 300, originY: 300, grid:true, unitX: 100, unitY: 100});
-
var ax = brd.createElement('line',[[0,0],[1,0]],{visible:true});
+
var ax = brd.createElement('line',[[0,0],[1,0]],{visible:false});
-
var ay = brd.createElement('line',[[0,0],[0,1]],{visible:true});
+
var ay = brd.createElement('line',[[0,0],[0,1]],{visible:false});
var p0 = brd.createElement('point',[0,0],{fixed:true,visible:false});
var p0 = brd.createElement('point',[0,0],{fixed:true,visible:false});
Zeile 17: Zeile 17:
brd.createElement('line',[p2,p4],{straightFirst:false,straightLast:false,strokeColor:'red'});    // cos
brd.createElement('line',[p2,p4],{straightFirst:false,straightLast:false,strokeColor:'red'});    // cos
-
brd.createElement('text',[p2.X(),p2.Y(),function(){return 'TEST';}]);
+
var t = brd.createElement('tangent',[p2],{visible:false});
 +
var p5 = brd.createElement('point',[brd.intersectionFunc(t,ax,0)],{visible:false,name:'',withLabel:false});
 +
var p6 = brd.createElement('point',[brd.intersectionFunc(t,ay,0)],{visible:false,name:'',withLabel:false});
 +
brd.createElement('line',[p5,p6],{straightFirst:false,straightLast:false});                      // tan + cot
 +
brd.createElement('line',[p0,p6],{straightFirst:false,straightLast:false,strokeColor:'green'});  // csc
 +
brd.createElement('line',[p0,p5],{straightFirst:false,straightLast:false,strokeColor:'green'});   // sec
 +
brd.createElement('text',[
 +
        function(){return (p0.X()+p2.X())*0.5;},
 +
        function(){return (p0.Y()+p2.Y())*0.5;},
 +
        '1'],{});
 +
 +
brd.createElement('text',[
 +
        function(){return (p2.X()+p4.X())*0.3;},
 +
        function(){return (p2.Y()+p4.Y())*0.5;},
 +
        'cos'],{});
 +
 +
brd.createElement('text',[
 +
        function(){return (p2.X()+p3.X())*0.5;},
 +
        function(){return (p2.Y()+p3.Y())*0.5;},
 +
        'sin'],{});
 +
 +
brd.createElement('text',[
 +
        function(){return 0.1+(p2.X()+p5.X())*0.5;},
 +
        function(){return 0.1+(p2.Y()+p5.Y())*0.5;},
 +
        'tan'],{});
 +
 +
brd.createElement('text',[
 +
        function(){return 0.1+(p2.X()+p6.X())*0.5;},
 +
        function(){return 0.1+(p2.Y()+p6.Y())*0.5;},
 +
        'cot'],{});
 +
 +
brd.createElement('text',[
 +
        function(){return -0.2+(p0.X()+p6.X())*0.5;},
 +
        function(){return (p0.Y()+p6.Y())*0.5;},
 +
        'csc'],{});
 +
 +
brd.createElement('text',[
 +
        function(){return (p0.X()+p5.X())*0.5;},
 +
        function(){return (p0.Y()+p5.Y())*0.5;},
 +
        'sec'],{});
</jsxgraph>
</jsxgraph>

Version vom 19:33, 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!):

Persönliche Werkzeuge