http://jsxgraph.org/wiki/api.php?action=feedcontributions&user=84.147.86.108&feedformat=atomJSXGraph Wiki - User contributions [en]2024-03-29T10:20:59ZUser contributionsMediaWiki 1.40.1http://jsxgraph.org/wiki/index.php?title=Circle&diff=232Circle2008-09-17T15:56:31Z<p>84.147.86.108: </p>
<hr />
<div>== Circle through two points ==<br />
One possibility to construct a circle is to give its center and a point defining its radius.<br />
Lets construct two points "A" and "B". <br />
<source lang="javascript"><br />
var b = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = board.createElement('point',[0,0], {name:'A',style:6});<br />
var p2 = board.createElement('point',[2,-1], {name:'B',style:6});<br />
</source><br />
Then we construct a circle through "A" and "B". The setting of a new color and changing the stroke-width is not necessary.<br />
<source lang="javascript"><br />
var ci = brd.createElement('circle',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</source><br />
<br />
<html><br />
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" /><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/prototype.js"></script><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script><br />
<div id="jxgbox" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd.createElement('point',[0,0], {name:'A',style:6});<br />
var p2 = brd.createElement('point',[2,-1], {name:'B',style:6});<br />
var ci = brd.createElement('circle',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</script><br />
</html><br />
<br />
Generally it is better to use JavaScript variables and not Geometry-Element names when constructing.<br />
Now, we do the same examples with JavaScript variables. To show other variations, we use a dashed stroke style and set a fill color.<br />
<br />
<source lang="javascript"><br />
var ci2 = brd2.createElement('circle',[p1,p2], <br />
{strokeWidth:3, dash:2, fillColor:'#ffff00', fillOpacity:0.3});<br />
</source><br />
<br />
<html><br />
<div id="jxgbox2" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd2 = JXG.JSXGraph.initBoard('jxgbox2', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd2.createElement('point',[0,0], {name:'A',style:6});<br />
var p2 = brd2.createElement('point',[2,-1], {name:'B',style:6});<br />
var ci2 = brd2.createElement('circle',[p1,p2], <br />
{strokeWidth:3, dash:2, fillColor:'#ffff00', fillOpacity:0.3});<br />
</script><br />
</html><br />
<br />
<br />
[[Category:Examples]]</div>84.147.86.108http://jsxgraph.org/wiki/index.php?title=Circle&diff=231Circle2008-09-17T15:55:39Z<p>84.147.86.108: </p>
<hr />
<div>== Circle through two points ==<br />
One possibility to construct a circle is to give its center and a point defining its radius.<br />
Lets construct two points "A" and "B". <br />
<source lang="javascript"><br />
var b = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = board.createElement('point',[0,0], {name:'A',style:6});<br />
var p2 = board.createElement('point',[2,-1], {name:'B',style:6});<br />
</source><br />
Then we construct a circle through "A" and "B". The setting of a new color and changing the stroke-width is not necessary.<br />
<source lang="javascript"><br />
var li = brd.createElement('circle',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</source><br />
<br />
<html><br />
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" /><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/prototype.js"></script><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script><br />
<div id="jxgbox" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd.createElement('point',[0,0], {name:'A',style:6});<br />
var p2 = brd.createElement('point',[2,-1], {name:'B',style:6});<br />
var ci = brd.createElement('circle',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</script><br />
</html><br />
<br />
Generally it is better to use JavaScript variables and not Geometry-Element names when constructing.<br />
Now, we do the same examples with JavaScript variables. To show other variations, we use a dashed stroke style and set a fill color.<br />
<br />
<source lang="javascript"><br />
var ci2 = brd2.createElement('circle',[p1,p2], <br />
{strokeWidth:3, dash:2, fillColor:'#ffff00', fillOpacity:0.3});<br />
</source><br />
<br />
<html><br />
<div id="jxgbox2" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd2 = JXG.JSXGraph.initBoard('jxgbox2', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd2.createElement('point',[0,0], {name:'A',style:6});<br />
var p2 = brd2.createElement('point',[2,-1], {name:'B',style:6});<br />
var ci2 = brd2.createElement('circle',[p1,p2], <br />
{strokeWidth:3, dash:2, fillColor:'#ffff00', fillOpacity:0.3});<br />
</script><br />
</html><br />
<br />
<br />
[[Category:Examples]]</div>84.147.86.108http://jsxgraph.org/wiki/index.php?title=Circle&diff=230Circle2008-09-17T15:52:09Z<p>84.147.86.108: New page: == Circle through two points == One possibility to construct a circle is to give its center and a point defining its radius. Lets construct two points "A" and "B". <source lang="javascript"> var b...</p>
<hr />
<div>== Circle through two points ==<br />
One possibility to construct a circle is to give its center and a point defining its radius.<br />
Lets construct two points "A" and "B". <br />
<source lang="javascript"><br />
var b = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = board.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = board.createElement('point',[2,-1], {name:'B',style:6});<br />
</source><br />
Then we construct a circle through "A" and "B". The setting of a new color and changing the stroke-width is not necessary.<br />
<source lang="javascript"><br />
var li = brd.createElement('circle',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</source><br />
<br />
<html><br />
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" /><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/prototype.js"></script><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script><br />
<div id="jxgbox" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = brd.createElement('point',[2,-1], {name:'B',style:6});<br />
var ci = brd.createElement('circle',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</script><br />
</html><br />
<br />
Generally it is better to use JavaScript variables and not Geometry-Element names when constructing.<br />
Now, we do the same examples with JavaScript variables. To show another variation, we use a dashed stroke style.<br />
<br />
<source lang="javascript"><br />
var ci2 = brd2.createElement('circle',[p1,p2], {strokeWidth:3, dash:2});<br />
</source><br />
<br />
<html><br />
<div id="jxgbox2" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd2 = JXG.JSXGraph.initBoard('jxgbox2', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd2.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = brd2.createElement('point',[2,-1], {name:'B',style:6});<br />
var ci2 = brd2.createElement('circle',[p1,p2], {strokeWidth:3, dash:2});<br />
</script><br />
</html><br />
<br />
<br />
[[Category:Examples]]</div>84.147.86.108http://jsxgraph.org/wiki/index.php?title=Line&diff=229Line2008-09-17T15:46:40Z<p>84.147.86.108: </p>
<hr />
<div>== Construction of a line ==<br />
A line needs two points. Lets construct two points "A" and "B". <br />
<source lang="javascript"><br />
var b = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = board.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = board.createElement('point',[2,-1], {name:'B',style:6});<br />
</source><br />
Then we construct a line through "A" and "B". The setting of a new color and changing the stroke-width is not necessary.<br />
<source lang="javascript"><br />
var li = brd.createElement('line',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</source><br />
<br />
<html><br />
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" /><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/prototype.js"></script><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script><br />
<div id="jxgbox" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = brd.createElement('point',[2,-1], {name:'B',style:6});<br />
var li = brd.createElement('line',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</script><br />
</html><br />
<br />
Generally it is better to use JavaScript variables and not Geometry-Element names when constructing.<br />
Now, we do the same examples with JavaScript variables. Further, we don't show the whole line, but only a segment. To show another variation, we use a dashed line style.<br />
<br />
<source lang="javascript"><br />
var li2 = brd2.createElement('line',[p1,p2], <br />
{straightFirst:false, straightLast:false, strokeWidth:2, dash:2});<br />
</source><br />
<br />
<html><br />
<div id="jxgbox2" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd2 = JXG.JSXGraph.initBoard('jxgbox2', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd2.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = brd2.createElement('point',[2,-1], {name:'B',style:6});<br />
var li2 = brd2.createElement('line',[p1,p2], {straightFirst:false, straightLast:false, strokeWidth:2, dash:2});<br />
</script><br />
</html><br />
<br />
<br />
[[Category:Examples]]</div>84.147.86.108http://jsxgraph.org/wiki/index.php?title=Line&diff=228Line2008-09-17T15:45:51Z<p>84.147.86.108: </p>
<hr />
<div>== Construction of a line ==<br />
A line needs two points. Lets construct two points "A" and "B". <br />
<source lang="javascript"><br />
var b = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = board.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = board.createElement('point',[2,-1], {name:'B',style:6});<br />
</source><br />
Then we construct a line through "A" and "B". The setting of a new color and changing the stroke-width is not necessary.<br />
<source lang="javascript"><br />
var li = brd.createElement('line',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</source><br />
<br />
<html><br />
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" /><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/prototype.js"></script><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script><br />
<div id="jxgbox" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = brd.createElement('point',[2,-1], {name:'B',style:6});<br />
var li = brd.createElement('line',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</script><br />
</html><br />
<br />
Generally it is better to use JavaScript variables and not Geometry-Element names when constructing.<br />
Now, we do the same examples with JavaScript variables. Further, we don't show the whole line, but only a segment. To show another variation, we use a dashed line style.<br />
<br />
<source lang="javascript"><br />
var li2 = brd2.createElement('line',[p1,p2], <br />
{straightFirst:false, straightLast:false, strokeWidth:2});<br />
</source><br />
<br />
<html><br />
<div id="jxgbox2" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd2 = JXG.JSXGraph.initBoard('jxgbox2', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd2.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = brd2.createElement('point',[2,-1], {name:'B',style:6});<br />
var li2 = brd2.createElement('line',[p1,p2], {straightFirst:false, straightLast:false, strokeWidth:2, dash:2});<br />
</script><br />
</html><br />
<br />
<br />
[[Category:Examples]]</div>84.147.86.108http://jsxgraph.org/wiki/index.php?title=Line&diff=227Line2008-09-17T15:45:12Z<p>84.147.86.108: </p>
<hr />
<div>== Construction of a line ==<br />
A line needs two points. Lets construct two points "A" and "B". <br />
<source lang="javascript"><br />
var b = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = board.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = board.createElement('point',[2,-1], {name:'B',style:6});<br />
</source><br />
Then we construct a line through "A" and "B". The setting of a new color and changing the stroke-width is not necessary.<br />
<source lang="javascript"><br />
var li = brd.createElement('line',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</source><br />
<br />
<html><br />
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" /><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/prototype.js"></script><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script><br />
<div id="jxgbox" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = brd.createElement('point',[2,-1], {name:'B',style:6});<br />
var li = brd.createElement('line',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</script><br />
</html><br />
<br />
Generally it is better to use JavaScript variables and not Geometry-Element names when constructing.<br />
Now, we do the same examples with JavaScript variables. Further, we don't show the whole line, but only a segment. To show another variant, we use a dashed line style.<br />
<br />
<source lang="javascript"><br />
var li2 = brd2.createElement('line',[p1,p2], {straightFirst:false, straightLast:false, strokeWidth:2});<br />
</source><br />
<br />
<html><br />
<div id="jxgbox2" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd2 = JXG.JSXGraph.initBoard('jxgbox2', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd2.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = brd2.createElement('point',[2,-1], {name:'B',style:6});<br />
var li2 = brd2.createElement('line',[p1,p2], {straightFirst:false, straightLast:false, strokeWidth:2, dash:2});<br />
</script><br />
</html><br />
<br />
<br />
[[Category:Examples]]</div>84.147.86.108http://jsxgraph.org/wiki/index.php?title=Line&diff=226Line2008-09-17T15:44:45Z<p>84.147.86.108: </p>
<hr />
<div>== Construction of a line ==<br />
A line needs two points. Lets construct two points "A" and "B". <br />
<source lang="javascript"><br />
var b = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = board.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = board.createElement('point',[2,-1], {name:'B',style:6});<br />
</source><br />
Then we construct a line through "A" and "B". The setting of a new color and changing the stroke-width is not necessary.<br />
<source lang="javascript"><br />
var li = brd.createElement('line',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</source><br />
<br />
<html><br />
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" /><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/prototype.js"></script><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script><br />
<div id="jxgbox" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = brd.createElement('point',[2,-1], {name:'B',style:6});<br />
var li = brd.createElement('line',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</script><br />
</html><br />
<br />
Generally it is better to use JavaScript variables and not Geometry-Element names when constructing.<br />
Now, we do the same examples with JavaScript variables. Further, we don't show the whole line, but only a segment. To show another variant, we use a dashed line style.<br />
<br />
<source lang="javascript"><br />
var li2 = brd2.createElement('line',[p1,p2], {straightFirst:false, straightLast:false, strokeWidth:2});<br />
</source><br />
<br />
<html><br />
<div id="jxgbox2" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd2 = JXG.JSXGraph.initBoard('jxgbox2', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd2.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = brd2.createElement('point',[2,-1], {name:'B',style:6});<br />
var li2 = brd2.createElement('line',[p1,p2], {straightFirst:false, straightLast:false, strokeWidth:2, dash:2});<br />
</script><br />
</html></div>84.147.86.108http://jsxgraph.org/wiki/index.php?title=Line&diff=225Line2008-09-17T15:43:36Z<p>84.147.86.108: </p>
<hr />
<div>== Construction of a line ==<br />
A line needs two points. Lets construct two points "A" and "B". <br />
<source lang="javascript"><br />
var b = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = board.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = board.createElement('point',[2,-1], {name:'B',style:6});<br />
</source><br />
Then we construct a line through "A" and "B". The setting of a new color and changing the stroke-width is not necessary.<br />
<source lang="javascript"><br />
var li = brd.createElement('line',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</source><br />
<br />
<html><br />
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" /><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/prototype.js"></script><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script><br />
<div id="jxgbox" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = brd.createElement('point',[2,-1], {name:'B',style:6});<br />
var li = brd.createElement('line',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</script><br />
</html><br />
<br />
Generally it is better to use JavaScript variables and not Geometry-Element names when constructing.<br />
Now, we do the same examples with JavaScript variables. Further, we don't show the whole line, but only a segment.<br />
<br />
<source lang="javascript"><br />
var li2 = brd2.createElement('line',[p1,p2], {straightFirst:false, straightLast:false, strokeWidth:2});<br />
</source><br />
<br />
<html><br />
<div id="jxgbox2" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd2 = JXG.JSXGraph.initBoard('jxgbox2', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd2.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = brd2.createElement('point',[2,-1], {name:'B',style:6});<br />
var li2 = brd2.createElement('line',[p1,p2], {straightFirst:false, straigtLast:false, strokeWidth:2});<br />
</script><br />
</html></div>84.147.86.108http://jsxgraph.org/wiki/index.php?title=Line&diff=224Line2008-09-17T15:42:57Z<p>84.147.86.108: </p>
<hr />
<div>== Construction of a line ==<br />
A line needs two points. Lets construct two points "A" and "B". <br />
<source lang="javascript"><br />
var b = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = board.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = board.createElement('point',[2,-1], {name:'B',style:6});<br />
</source><br />
Then we construct a line through "A" and "B". The setting of a new color and changing the stroke-width is not necessary.<br />
<source lang="javascript"><br />
var li = brd.createElement('line',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</source><br />
<br />
<html><br />
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" /><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/prototype.js"></script><br />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script><br />
<div id="jxgbox" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = brd.createElement('point',[2,-1], {name:'B',style:6});<br />
var li = brd.createElement('line',["A","B"], {strokeColor:'#00ff00',strokeWidth:2});<br />
</script><br />
</html><br />
<br />
Generally it is better to use JavaScript variables and not Geometry-Element names when constructing.<br />
Now, we do the same examples with JavaScript variables. Further, we don't show the whole line, but only a segment.<br />
<br />
<source lang="javascript"><br />
var li2 = brd2.createElement('line',[p1,p2], {straightFirst:false, straigtLast:false, strokeWidth:2});<br />
</source><br />
<br />
<html><br />
<div id="jxgbox2" class="jxgbox" style="width:500px; height:200px;"></div><br />
<script type="text/javascript"><br />
var brd2 = JXG.JSXGraph.initBoard('jxgbox2', {originX: 200, originY: 100, unitX: 50, unitY: 50});<br />
var p1 = brd2.createElement('point',[-1,1], {name:'A',style:6});<br />
var p2 = brd2.createElement('point',[2,-1], {name:'B',style:6});<br />
var li2 = brd2.createElement('line',[p1,p2], {straightFirst:false, straigtLast:false, strokeWidth:2});<br />
</script><br />
</html></div>84.147.86.108