Difference between revisions of "Polygon"
From JSXGraph Wiki
Jump to navigationJump to searchm |
A WASSERMANN (talk | contribs) |
||
(2 intermediate revisions by the same user not shown) | |||
Line 3: | Line 3: | ||
<source lang="javascript"> | <source lang="javascript"> | ||
var b = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50}); | var b = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50}); | ||
− | var p1 = b.createElement('point',[0,0], {name:' | + | var p1 = b.createElement('point',[0,0], {name:'X',style:6}); |
var p2 = b.createElement('point',[2,-1], {name:'B',style:6}); | var p2 = b.createElement('point',[2,-1], {name:'B',style:6}); | ||
var p3 = b.createElement('point',[-2,-3], {name:'C',style:6}); | var p3 = b.createElement('point',[-2,-3], {name:'C',style:6}); | ||
Line 12: | Line 12: | ||
Next we create a polygon through these five points "A" to "E". | Next we create a polygon through these five points "A" to "E". | ||
<source lang="javascript"> | <source lang="javascript"> | ||
− | var poly = b.createElement('polygon',[" | + | var poly = b.createElement('polygon',["X","B","C","D","E"]); |
</source> | </source> | ||
Of course we can also use the JavaScript objects p1 to p5: | Of course we can also use the JavaScript objects p1 to p5: | ||
Line 21: | Line 21: | ||
<html> | <html> | ||
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" /> | <link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" /> | ||
− | |||
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script> | <script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script> | ||
<div id="jxgbox" class="jxgbox" style="width:500px; height:300px;"></div> | <div id="jxgbox" class="jxgbox" style="width:500px; height:300px;"></div> | ||
<script type="text/javascript"> | <script type="text/javascript"> | ||
var b1 = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50}); | var b1 = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50}); | ||
− | var p1 = b1.createElement('point',[0,0], {name:' | + | var p1 = b1.createElement('point',[0,0], {name:'X',style:6}); |
var p2 = b1.createElement('point',[2,-1], {name:'B',style:6}); | var p2 = b1.createElement('point',[2,-1], {name:'B',style:6}); | ||
var p3 = b1.createElement('point',[-2,-3], {name:'C',style:6}); | var p3 = b1.createElement('point',[-2,-3], {name:'C',style:6}); |
Revision as of 19:20, 29 October 2009
Polygon defined by existing points
To construct a polygon an array of already constructed points is required. So we first have to construct at least three points:
var b = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});
var p1 = b.createElement('point',[0,0], {name:'X',style:6});
var p2 = b.createElement('point',[2,-1], {name:'B',style:6});
var p3 = b.createElement('point',[-2,-3], {name:'C',style:6});
var p4 = b.createElement('point',[-1,-1], {name:'D',style:6});
var p5 = b.createElement('point',[3,1], {name:'E',style:6});
Note that the "style" option is optional as is the parameter "name". Next we create a polygon through these five points "A" to "E".
var poly = b.createElement('polygon',["X","B","C","D","E"]);
Of course we can also use the JavaScript objects p1 to p5:
var poly = b.createElement('polygon',[p1,p2,p3,p4,p5]);
The result is the same: