Polygon II: Difference between revisions
From JSXGraph Wiki
A WASSERMANN (talk | contribs) No edit summary |
A WASSERMANN (talk | contribs) No edit summary |
||
(18 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
The triangle ''ABC'' can be moved by dragging ''A'' and it can be rotated around ''A'' by moving ''B''. | |||
<jsxgraph width="500" height="500"> | <jsxgraph width="500" height="500"> | ||
var brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-3,3,3,-3]}); | var brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-3,3,3,-3]}); | ||
var p1 = brd.create('point',[-1,-1]); | var p1 = brd.create('point',[-1,-1]); | ||
var | var c1 = brd.create('circle',[p1,3],{strokeOpacity:0.1}); // | ||
var p2 = brd.create('glider',[2,-1,c1]); // p2 glides on circle c1 | |||
var | var rot = brd.create('transform',[function(){ return Math.PI/4;},p1],{type:'rotate'}); // rot is defined by the angle BAC | ||
var p3 = brd.create('point',[p2,rot],{fixed:true,size:1,name:'h1'}); // h1: B rotated around A with angle rot | |||
var line = brd.create('line',[p1,p3],{strokeOpacity:0.1}); // line through A and h1 | |||
var p4 = brd.create('glider',[0,0.5,line],{fixed:true}); // C is on the line with a fixed distance from A | |||
var poly = brd.create('polygon',[p1,p2,p4], {fillOpacity:0.05}); | |||
</jsxgraph> | </jsxgraph> | ||
===The underlying JavvaScript code=== | |||
For the elements ''c1'', ''p3'', ''line'' the attribute ''visible'' should be set to false. | |||
<source lang="javascript"> | |||
var brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-3,3,3,-3]}); | |||
var p1 = brd.create('point',[-1,-1]); | |||
var c1 = brd.create('circle',[p1,3],{strokeOpacity:0.1}); // | |||
var p2 = brd.create('glider',[2,-1,c1]); // p2 glides on circle c1 | |||
var rot = brd.create('transform',[function(){ return Math.PI/4;},p1],{type:'rotate'}); // rot is defined by the angle BAC | |||
var p3 = brd.create('point',[p2,rot],{fixed:true,size:1,name:'h1'}); // h1: B rotated around A with angle rot | |||
var line = brd.create('line',[p1,p3],{strokeOpacity:0.1}); // line through A and h1 | |||
var p4 = brd.create('glider',[0,0.5,line],{fixed:true}); // C is on the line with a fixed distance from A | |||
var poly = brd.create('polygon',[p1,p2,p4], {fillOpacity:0.05}); | |||
</source> | |||
[[Category:Examples]] |
Latest revision as of 10:10, 3 August 2010
The triangle ABC can be moved by dragging A and it can be rotated around A by moving B.
The underlying JavvaScript code
For the elements c1, p3, line the attribute visible should be set to false.
var brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-3,3,3,-3]});
var p1 = brd.create('point',[-1,-1]);
var c1 = brd.create('circle',[p1,3],{strokeOpacity:0.1}); //
var p2 = brd.create('glider',[2,-1,c1]); // p2 glides on circle c1
var rot = brd.create('transform',[function(){ return Math.PI/4;},p1],{type:'rotate'}); // rot is defined by the angle BAC
var p3 = brd.create('point',[p2,rot],{fixed:true,size:1,name:'h1'}); // h1: B rotated around A with angle rot
var line = brd.create('line',[p1,p3],{strokeOpacity:0.1}); // line through A and h1
var p4 = brd.create('glider',[0,0.5,line],{fixed:true}); // C is on the line with a fixed distance from A
var poly = brd.create('polygon',[p1,p2,p4], {fillOpacity:0.05});