Spirograph - geometric construction: Difference between revisions
From JSXGraph Wiki
| A WASSERMANN (talk | contribs) No edit summary | A WASSERMANN (talk | contribs) No edit summary | ||
| (19 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
| === Double speed === | |||
| The speed of <math>C</math> is twice the speed of <math>B</math>. | |||
| <jsxgraph width="600" height="600"> | <jsxgraph width="600" height="600"> | ||
| (function() { | |||
| var brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-5,5,5,-5], keepaspectratio:true}); | var brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-5,5,5,-5], keepaspectratio:true}); | ||
| var O = brd.create('point',[0,0],{name:'O',fixed:true, fillColor:'blue', strokeColor:'blue'}); | var O = brd.create('point',[0,0],{name:'O',fixed:true, fillColor:'blue', strokeColor:'blue'}); | ||
| var A = brd.create('point',[ | var A = brd.create('point',[2,0],{name:'A'}); | ||
| var k = brd.create('circle',[O,A],{name:'k'}); | var k = brd.create('circle',[O,A],{name:'k'}); | ||
| var B = brd.create('glider',[0.7,1,k],{name:'B drag me'}); | var B = brd.create('glider',[0.7,1,k],{name:'B drag me'}); | ||
| var g1 = brd.create('line',[O,B], {strokeColor:'lightgray'}); | var g1 = brd.create('line',[O,B], {strokeColor:'lightgray'}); | ||
| var C = brd.create('reflection',[g1 | var C = brd.create('reflection',[A, g1],{name:'C', fillColor:'blue', strokeColor:'blue'}); | ||
| var M = brd.create('glider',[2,2,g1], {name:'M', fillColor:'red', strokeColor:'red'}); | |||
| var k2 = brd.create('circle',[M,B],{name:'k'});   | |||
| var gpar = brd.create('parallel',[O,C,M], {name:"g", strokeColor:'lightgray'}); | |||
| var Cprime = brd.create('intersection',[gpar,k2,0], {name:"C'", fillColor:'blue', strokeColor:'blue'}); | |||
| var g2 = brd.create('line',[M,Cprime], {strokeColor:'lightgray'}); | |||
| var Cstern = brd.create('glider',[1,1,g2], {name:"C*", trace:true, fillColor:'green', strokeColor:'green'}); | |||
| })(); | |||
| </jsxgraph> | |||
| ====The JavaScript code==== | |||
| <source lang="javascript"> | |||
| (function() { | |||
| var brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-5,5,5,-5], keepaspectratio:true}); | |||
| var O = brd.create('point',[0,0],{name:'O',fixed:true, fillColor:'blue', strokeColor:'blue'}); | |||
| var A = brd.create('point',[2,0],{name:'A'}); | |||
| var k = brd.create('circle',[O,A],{name:'k'}); | |||
| var B = brd.create('glider',[0.7,1,k],{name:'B drag me'}); | |||
| var g1 = brd.create('line',[O,B], {strokeColor:'lightgray'}); | |||
| var C = brd.create('reflection',[A, g1],{name:'C', fillColor:'blue', strokeColor:'blue'}); | |||
| var M = brd.create('glider',[2,2,g1], {name:'M', fillColor:'red', strokeColor:'red'}); | |||
| var k2 = brd.create('circle',[M,B],{name:'k'});   | |||
| var gpar = brd.create('parallel',[O,C,M], {name:"g", strokeColor:'lightgray'}); | |||
| var Cprime = brd.create('intersection',[gpar,k2,0], {name:"C'", fillColor:'blue', strokeColor:'blue'}); | |||
| var g2 = brd.create('line',[M,Cprime], {strokeColor:'lightgray'}); | var g2 = brd.create('line',[M,Cprime], {strokeColor:'lightgray'}); | ||
| var Cstern = brd.create('glider',[1,1,g2], {name:"C*", trace:true}); | var Cstern = brd.create('glider',[1,1,g2], {name:"C*", trace:true, fillColor:'green', strokeColor:'green'}); | ||
| })(); | |||
| </source> | |||
| === Threefold speed === | |||
| The speed of <math>C_2</math> is three times the speed of <math>B</math>. | |||
| <jsxgraph width="600" height="600" box="jxgbox2"> | |||
| (function() { | |||
| var brd = JXG.JSXGraph.initBoard('jxgbox2',{boundingbox:[-5,5,5,-5], keepaspectratio:true}); | |||
| var O = brd.create('point',[0,0],{name:'O',fixed:true, fillColor:'blue', strokeColor:'blue'}); | |||
| var A = brd.create('point',[2,0],{name:'A'}); | |||
| var k = brd.create('circle',[O,A],{name:'k'}); | |||
| var B = brd.create('glider',[0.7,1,k],{name:'B drag me'}); | |||
| var g1 = brd.create('line',[O,B], {strokeColor:'lightgray'}); | |||
| var C = brd.create('reflection',[A, g1],{name:'C', fillColor:'blue', strokeColor:'blue'}); | |||
| var g1a = brd.create('line',[O,C], {strokeColor:'lightgray'}); | |||
| var C2 = brd.create('reflection',[B, g1a],{name:'C_2', fillColor:'blue', strokeColor:'blue'}); | |||
| var M = brd.create('glider',[2,2,g1], {name:'M', fillColor:'red', strokeColor:'red'}); | |||
| var k2 = brd.create('circle',[M,B],{name:'k'});   | |||
| var gpar = brd.create('parallel',[O,C2,M], {name:"g", strokeColor:'lightgray'}); | |||
| var Cprime = brd.create('intersection',[gpar,k2,0], {name:"C'", fillColor:'blue', strokeColor:'blue'}); | |||
| var g2 = brd.create('line',[M,Cprime], {strokeColor:'lightgray'}); | |||
| var Cstern = brd.create('glider',[1,1,g2], {name:"C*", trace:true, fillColor:'green', strokeColor:'green'}); | |||
| })(); | |||
| </jsxgraph> | </jsxgraph> | ||
| ====The JavaScript code==== | |||
| <source lang="javascript"> | |||
| (function() { | |||
| var brd = JXG.JSXGraph.initBoard('jxgbox2',{boundingbox:[-5,5,5,-5], keepaspectratio:true}); | |||
| var O = brd.create('point',[0,0],{name:'O',fixed:true, fillColor:'blue', strokeColor:'blue'}); | |||
| var A = brd.create('point',[2,0],{name:'A'}); | |||
| var k = brd.create('circle',[O,A],{name:'k'}); | |||
| var B = brd.create('glider',[0.7,1,k],{name:'B drag me'}); | |||
| var g1 = brd.create('line',[O,B], {strokeColor:'lightgray'}); | |||
| var C = brd.create('reflection',[A, g1],{name:'C', fillColor:'blue', strokeColor:'blue'}); | |||
| var g1a = brd.create('line',[O,C], {strokeColor:'lightgray'}); | |||
| var C2 = brd.create('reflection',[B, g1a],{name:'C_2', fillColor:'blue', strokeColor:'blue'}); | |||
| var M = brd.create('glider',[2,2,g1], {name:'M', fillColor:'red', strokeColor:'red'}); | |||
| var k2 = brd.create('circle',[M,B],{name:'k'});   | |||
| var gpar = brd.create('parallel',[O,C2,M], {name:"g", strokeColor:'lightgray'}); | |||
| var Cprime = brd.create('intersection',[gpar,k2,0], {name:"C'", fillColor:'blue', strokeColor:'blue'}); | |||
| var g2 = brd.create('line',[M,Cprime], {strokeColor:'lightgray'}); | |||
| var Cstern = brd.create('glider',[1,1,g2], {name:"C*", trace:true, fillColor:'green', strokeColor:'green'}); | |||
| })(); | |||
| </source> | |||
| === Fourfold speed === | |||
| The speed of <math>C_2</math> is four times the speed of <math>B</math>. | |||
| <jsxgraph width="600" height="600" box="jxgbox3"> | |||
| (function() { | |||
| var brd = JXG.JSXGraph.initBoard('jxgbox3',{boundingbox:[-5,5,5,-5], keepaspectratio:true}); | |||
| var O = brd.create('point',[0,0],{name:'O',fixed:true, fillColor:'blue', strokeColor:'blue'}); | |||
| var A = brd.create('point',[2,0],{name:'A'}); | |||
| var k = brd.create('circle',[O,A],{name:'k'}); | |||
| var B = brd.create('glider',[0.7,1,k],{name:'B drag me'}); | |||
| var g1 = brd.create('line',[O,B], {strokeColor:'lightgray'}); | |||
| var C = brd.create('reflection',[A,g1],{name:'C', fillColor:'blue', strokeColor:'blue'}); | |||
| var g1a = brd.create('line',[O,C], {strokeColor:'lightgray'}); | |||
| var C2 = brd.create('reflection',[A, g1a],{name:'C_2', fillColor:'blue', strokeColor:'blue'}); | |||
| var M = brd.create('glider',[2,2,g1], {name:'M', fillColor:'red', strokeColor:'red'}); | |||
| var k2 = brd.create('circle',[M,B],{name:'k'});   | |||
| var gpar = brd.create('parallel',[O,C2,M], {name:"g", strokeColor:'lightgray'}); | |||
| var Cprime = brd.create('intersection',[gpar,k2,0], {name:"C'", fillColor:'blue', strokeColor:'blue'}); | |||
| var g2 = brd.create('line',[M,Cprime], {strokeColor:'lightgray'}); | |||
| var Cstern = brd.create('glider',[3,3,g2], {name:"C*", trace:true, fillColor:'green', strokeColor:'green'}); | |||
| })(); | |||
| </jsxgraph> | |||
| ====The JavaScript code==== | |||
| <source lang="javascript"> | |||
| (function() { | |||
| var brd = JXG.JSXGraph.initBoard('jxgbox3',{boundingbox:[-5,5,5,-5], keepaspectratio:true}); | |||
| var O = brd.create('point',[0,0],{name:'O',fixed:true, fillColor:'blue', strokeColor:'blue'}); | |||
| var A = brd.create('point',[2,0],{name:'A'}); | |||
| var k = brd.create('circle',[O,A],{name:'k'}); | |||
| var B = brd.create('glider',[0.7,1,k],{name:'B drag me'}); | |||
| var g1 = brd.create('line',[O,B], {strokeColor:'lightgray'}); | |||
| var C = brd.create('reflection',[A, g1],{name:'C', fillColor:'blue', strokeColor:'blue'}); | |||
| var g1a = brd.create('line',[O,C], {strokeColor:'lightgray'}); | |||
| var C2 = brd.create('reflection',[A, g1a],{name:'C_2', fillColor:'blue', strokeColor:'blue'}); | |||
| var M = brd.create('glider',[2,2,g1], {name:'M', fillColor:'red', strokeColor:'red'}); | |||
| var k2 = brd.create('circle',[M,B],{name:'k'});   | |||
| var gpar = brd.create('parallel',[O,C2,M], {name:"g", strokeColor:'lightgray'}); | |||
| var Cprime = brd.create('intersection',[gpar,k2,0], {name:"C'", fillColor:'blue', strokeColor:'blue'}); | |||
| var g2 = brd.create('line',[M,Cprime], {strokeColor:'lightgray'}); | |||
| var Cstern = brd.create('glider',[3,3,g2], {name:"C*", trace:true, fillColor:'green', strokeColor:'green'}); | |||
| })(); | |||
| </source> | |||
| ===Literatur=== | |||
| * W. Neidhardt, Ch. Wurm: ''Arbeitsbuch THALES, Geometrie mit dem Computer'', Dümmler-Verlag 1997. ISBN 3-427-45511-4 | |||
| [[Category:Examples]] | [[Category:Examples]] | ||
| [[Category:Curves]] | [[Category:Curves]] | ||
| [[Category:Geometry]] | [[Category:Geometry]] | ||
Latest revision as of 14:08, 14 December 2020
Double speed
The speed of [math]\displaystyle{ C }[/math] is twice the speed of [math]\displaystyle{ B }[/math].
The JavaScript code
(function() {
var brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-5,5,5,-5], keepaspectratio:true});
var O = brd.create('point',[0,0],{name:'O',fixed:true, fillColor:'blue', strokeColor:'blue'});
var A = brd.create('point',[2,0],{name:'A'});
var k = brd.create('circle',[O,A],{name:'k'});
var B = brd.create('glider',[0.7,1,k],{name:'B drag me'});
var g1 = brd.create('line',[O,B], {strokeColor:'lightgray'});
var C = brd.create('reflection',[A, g1],{name:'C', fillColor:'blue', strokeColor:'blue'});
var M = brd.create('glider',[2,2,g1], {name:'M', fillColor:'red', strokeColor:'red'});
var k2 = brd.create('circle',[M,B],{name:'k'});  
var gpar = brd.create('parallel',[O,C,M], {name:"g", strokeColor:'lightgray'});
var Cprime = brd.create('intersection',[gpar,k2,0], {name:"C'", fillColor:'blue', strokeColor:'blue'});
var g2 = brd.create('line',[M,Cprime], {strokeColor:'lightgray'});
var Cstern = brd.create('glider',[1,1,g2], {name:"C*", trace:true, fillColor:'green', strokeColor:'green'});
})();
Threefold speed
The speed of [math]\displaystyle{ C_2 }[/math] is three times the speed of [math]\displaystyle{ B }[/math].
The JavaScript code
(function() {
var brd = JXG.JSXGraph.initBoard('jxgbox2',{boundingbox:[-5,5,5,-5], keepaspectratio:true});
var O = brd.create('point',[0,0],{name:'O',fixed:true, fillColor:'blue', strokeColor:'blue'});
var A = brd.create('point',[2,0],{name:'A'});
var k = brd.create('circle',[O,A],{name:'k'});
var B = brd.create('glider',[0.7,1,k],{name:'B drag me'});
var g1 = brd.create('line',[O,B], {strokeColor:'lightgray'});
var C = brd.create('reflection',[A, g1],{name:'C', fillColor:'blue', strokeColor:'blue'});
var g1a = brd.create('line',[O,C], {strokeColor:'lightgray'});
var C2 = brd.create('reflection',[B, g1a],{name:'C_2', fillColor:'blue', strokeColor:'blue'});
var M = brd.create('glider',[2,2,g1], {name:'M', fillColor:'red', strokeColor:'red'});
var k2 = brd.create('circle',[M,B],{name:'k'});  
var gpar = brd.create('parallel',[O,C2,M], {name:"g", strokeColor:'lightgray'});
var Cprime = brd.create('intersection',[gpar,k2,0], {name:"C'", fillColor:'blue', strokeColor:'blue'});
var g2 = brd.create('line',[M,Cprime], {strokeColor:'lightgray'});
var Cstern = brd.create('glider',[1,1,g2], {name:"C*", trace:true, fillColor:'green', strokeColor:'green'});
})();
Fourfold speed
The speed of [math]\displaystyle{ C_2 }[/math] is four times the speed of [math]\displaystyle{ B }[/math].
The JavaScript code
(function() {
var brd = JXG.JSXGraph.initBoard('jxgbox3',{boundingbox:[-5,5,5,-5], keepaspectratio:true});
var O = brd.create('point',[0,0],{name:'O',fixed:true, fillColor:'blue', strokeColor:'blue'});
var A = brd.create('point',[2,0],{name:'A'});
var k = brd.create('circle',[O,A],{name:'k'});
var B = brd.create('glider',[0.7,1,k],{name:'B drag me'});
var g1 = brd.create('line',[O,B], {strokeColor:'lightgray'});
var C = brd.create('reflection',[A, g1],{name:'C', fillColor:'blue', strokeColor:'blue'});
var g1a = brd.create('line',[O,C], {strokeColor:'lightgray'});
var C2 = brd.create('reflection',[A, g1a],{name:'C_2', fillColor:'blue', strokeColor:'blue'});
var M = brd.create('glider',[2,2,g1], {name:'M', fillColor:'red', strokeColor:'red'});
var k2 = brd.create('circle',[M,B],{name:'k'});  
var gpar = brd.create('parallel',[O,C2,M], {name:"g", strokeColor:'lightgray'});
var Cprime = brd.create('intersection',[gpar,k2,0], {name:"C'", fillColor:'blue', strokeColor:'blue'});
var g2 = brd.create('line',[M,Cprime], {strokeColor:'lightgray'});
var Cstern = brd.create('glider',[3,3,g2], {name:"C*", trace:true, fillColor:'green', strokeColor:'green'});
})();
Literatur
- W. Neidhardt, Ch. Wurm: Arbeitsbuch THALES, Geometrie mit dem Computer, Dümmler-Verlag 1997. ISBN 3-427-45511-4
