Difference between revisions of "Thales inscribed angle theorem"

From JSXGraph Wiki
Jump to navigationJump to search
(Created page with "This example demonstrates Thales' inscribed angle theorem. You can move point the <math>P</math>, or <math>A</math> and <math>B</math>. It also demonstrates how to dynamically ge...")
 
 
Line 40: Line 40:
 
===The underlying JavaScript code===
 
===The underlying JavaScript code===
 
<source lang="javascript">
 
<source lang="javascript">
var brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-8,8,8,-8]});
+
var brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-6,6,6,-6]});
 
o1 = brd.create('point', [-2, 2], {name: 'O1'});
 
o1 = brd.create('point', [-2, 2], {name: 'O1'});
 
o2 = brd.create('point', [3, -3], {name: 'O2'});
 
o2 = brd.create('point', [3, -3], {name: 'O2'});

Latest revision as of 00:17, 27 January 2014

This example demonstrates Thales' inscribed angle theorem. You can move point the [math]P[/math], or [math]A[/math] and [math]B[/math]. It also demonstrates how to dynamically get an angle value in JSXGraph and set a label based on it using hooks.

The underlying JavaScript code

var brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-6,6,6,-6]});
o1 = brd.create('point', [-2, 2], {name: 'O1'});
o2 = brd.create('point', [3, -3], {name: 'O2'});

p1 = brd.create('point', [-3, 5], {name: 'P1'});
p2 = brd.create('point', [2, -3], {name: 'P2'});

c1 = brd.create('circle', [o1, p1]);
c2 = brd.create('circle', [o2, p2]);

m = brd.create('midpoint', [o1, o2], {name: 'M'});
lm = brd.create('line', [o1, o2], {'strokeWidth': '1px', 'strokeColor':'gray'} );

c3 = brd.create('circle', [m, o2], {'strokeColor':'green', strokeWidth: '1px'});

c4 = brd.create('circle', [o1, function() {
        r1 = c1.Radius();
        r2 = c2.Radius();
        if(r1 > r2) {
            return r1 - r2;
        } else {
            return r2 + r1;
        }
}], {'strokeColor': 'purple', strokeWidth: '1px'});

i1 = brd.create('intersection', [c3,c4,0],{visible:true});
i2 = brd.create('intersection', [c3,c4,1],{visible:true});

l1 = brd.create('line', [o1, i1], {visible: false});
l2 = brd.create('line', [o1, i2], {visible: false});

i3 = brd.create('intersection', [c1,l1,0],{visible:true});
i4 = brd.create('intersection', [c1,l2,0],{visible:true});

v1 = brd.create('arrow', [o1, i3], {strokeColor: 'lightblue', strokeWidth: '1px'});
v2 = brd.create('arrow', [o1, i4], {strokeColor: 'lightblue', strokeWidth: '1px'});

l3 = brd.create('line', [i1, o1], {visible: false});
l4 = brd.create('line', [o1, i2], {visible: false});

t1 = brd.create('tangent', [c1, i3], {strokeColor:'darkblue'});
t2 = brd.create('tangent', [c1, i4], {strokeColor:'darkblue'});

t3 = brd.create('line', [o2, i1], {strokeColor:'pink'});
t4 = brd.create('line', [o2, i2], {strokeColor:'pink'});