1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
|
<html>
<head>
<title>JSXGraph example</title>
<link rel="stylesheet" type="text/css" href="../distrib/jsxgraph.css" />
<script type="text/javascript" src="../distrib/jquery.min.js"></script>
<script type="text/javascript" src="../src/loadjsxgraph.js"></script>
</head>
<body>
<h1 onclick="brd.clearTraces();">Polygon</h1>
from <a href="http://tracenpoche.sesamath.net/">http://tracenpoche.sesamath.net/</a>
<form><input type="text"></form>
<!-- Drawing area -->
<div id="box" class="jxgbox" style="width:600px; height:600px; overflow:hidden; /*position:absolute; top:0px; left:0px;*/"></div>
<!-- Drawing area -->
<div id="debug" style="display:block;"></div>
<script type="text/javascript">
/* <![CDATA[ */
var brd;
function doit() {
brd = JXG.JSXGraph.initBoard('box', {originX: 300, originY: 300, grid:true, unitX: 25, unitY: 25});
var A = [];
var B = [];
var C = [];
var D = [];
A[0] = brd.create('point', [-9,5], {name:'A_0'});
B[0] = brd.create('point', [8,8], {name:'B_0'});
C[0] = brd.create('point', [-8,-3], {name:'C_0'});
D[0] = brd.create('point', [9,-8], {name:'D_0'});
for (var i = 0; i<=18; i++) {
A[i+1]= brd.create('point', (function(i){var p = 0.05*(i+1); return [
function () {return (1-p)*A[0].X()+p*B[0].X();},
function () {return (1-p)*A[0].Y()+p*B[0].Y();}] })(i), {name:' ',visible:false});
B[i+1]= brd.create('point', (function(i){var p = 0.05*(i+1); return [
function () {return (1-p)*B[0].X()+p*C[0].X();},
function () {return (1-p)*B[0].Y()+p*C[0].Y();}] })(i), {name:' ',visible:false});
C[i+1]= brd.create('point', (function(i){var p = 0.05*(i+1); return [
function () {return (1-p)*C[0].X()+p*D[0].X();},
function () {return (1-p)*C[0].Y()+p*D[0].Y();}] })(i), {name:' ',visible:false});
}
var p1 = brd.create('polygon', [A[0], B[1], B[2], A[1], A[2], B[3], B[4], A[3], A[4], B[5], B[6], A[5], A[6], B[7], B[8], A[7], A[8], B[9], B[10], A[9], A[10], B[11], B[12], A[11], A[12], B[13], B[14], A[13], A[14], B[15], B[16], A[15], A[16], B[17], B[18], A[17], A[18], B[19], C[0], A[19]],
{lines:{strokeWidth:1}, withLabel:false});
var p2 = brd.create('polygon', [C[1], B[0], B[1], C[2], C[3], B[2], B[3], C[4], C[5], B[4], B[5], C[6], C[7], B[6], B[7], C[8], C[9], B[8], B[9], C[10], C[11], B[10], B[11], C[12], C[13], B[12], B[13], C[14], C[15], B[14], B[15], C[16], C[17], B[16], B[17], C[18], C[19], B[18], B[19], D[0]],
{withLabel:false, fillColor:'blue',
lines: {strokeWidth:1, strokeColor:'black'},
trace:false
});
brd.create('line',[A[0],B[0]],{straightFirst:false,straightLast:false,strokeWidth:1,withLabel:false});
brd.create('line',[B[0],C[0]],{straightFirst:false,straightLast:false,strokeWidth:1,withLabel:false});
brd.create('line',[C[0],D[0]],{straightFirst:false,straightLast:false,strokeWidth:1,withLabel:false});
for (i=0;i<p1.borders.length;i++) p1.borders[i].setProperty({strokeWidth:1});
for (i=0;i<p2.borders.length;i++) p2.borders[i].setProperty({strokeWidth:1});
};
doit();
JXG.JSXGraph.freeBoard(brd);
doit();
/* ]]> */
</script>
</body>
</html>
|
