Polygon II: Difference between revisions

From JSXGraph Wiki
No edit summary
No edit summary
Line 1: Line 1:
The triangle ''ABC'' can be moved around by dragging ''A'' and it can be rotated by moving ''B''.
The triangle ''ABC'' can be moved around 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]});

Revision as of 11:39, 3 March 2010

The triangle ABC can be moved around 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});