Sine and cosine: Difference between revisions
From JSXGraph Wiki
A WASSERMANN (talk | contribs) (New page: <html> <link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" /> <script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/pro...) |
A WASSERMANN (talk | contribs) No edit summary |
||
Line 11: | Line 11: | ||
</table> | </table> | ||
Click here to start and stop <a href="javascript:void(0);" onclick="animate(b1p1, -10, 41);">animation</a>. | Click here to start and stop <a href="javascript:void(0);" onclick="animate(b1p1, -10, 41);">animation</a>. | ||
<script language="JavaScript"> | <script language="JavaScript"> | ||
board = JXG.JSXGraph.initBoard('box', {originX: 250, originY: 250, unitX: 150, unitY: 150}); | board = JXG.JSXGraph.initBoard('box', {originX: 250, originY: 250, unitX: 150, unitY: 150}); | ||
board2 = JXG.JSXGraph.initBoard('box2', {originX: 100, originY: 250, unitX: 50, unitY: 150}); | board2 = JXG.JSXGraph.initBoard('box2', {originX: 100, originY: 250, unitX: 50, unitY: 150}); | ||
Line 101: | Line 99: | ||
} | } | ||
} | } | ||
</script> | |||
</source> | </source> | ||
[[Category:Examples]] | [[Category:Examples]] |
Revision as of 17:42, 3 January 2009
Click here to start and stop animation.
The underlying JavaScript code
board = JXG.JSXGraph.initBoard('box', {originX: 250, originY: 250, unitX: 150, unitY: 150});
board2 = JXG.JSXGraph.initBoard('box2', {originX: 100, originY: 250, unitX: 50, unitY: 150});
board.createElement('axis', [[0,0], [0,1]]);
board.createElement('axis', [[0,0], [1,0]]);
board2.createElement('axis', [[0,0], [1,0]]);
board2.createElement('axis', [[0,0], [0,1]]);
b1c1 = board.createElement('circle', ['Ursprung', 'Punkt_1_0']);
b1p1 = board.createElement('point', [2, 0], {slideObject: b1c1});
perp = board.createElement('perpendicular', ['X-Achse',b1p1],{strokeColor:['#ff0000',null],visible:[true,false]});
perp2 = board.createElement('perpendicular',['Y-Achse',b1p1],{strokeColor:['#0000ff',null],visible:[true,false]});
// sine:
b2p1 = board2.createElement('point', [
function(){
return board.algebra.rad(JXG.GetReferenceFromParameter(board, 'Punkt_1_0'),
JXG.GetReferenceFromParameter(board, 'Ursprung'), b1p1); }, #
function() { return b1p1.Y() }],
{fixed: true, trace: true, strokeColor: '#ff0000', name: 'S'});
// cosine:
b2p2 = board2.createElement('point', [
function(){ return board.algebra.rad(JXG.GetReferenceFromParameter(board, 'Punkt_1_0'),
JXG.GetReferenceFromParameter(board, 'Ursprung'), b1p1); },
function() { return b1p1.X() }],
{fixed: true, trace: true, strokeColor: '#0000ff', name: 'C'});
// Dependencies (only necessary if b2p1 or b2p2 is deleted)
b1p1.addChild(b2p1);
b1p1.addChild(b2p2);
// Animation
var animated = false;
function animate(point, direction, count) {
if(animated) {
point.stopAnimation();
animated = false;
} else {
point.startAnimation(direction, count);
animated = true;
}
}
</script>