Random points: Difference between revisions

From JSXGraph Wiki
No edit summary
No edit summary
Line 2: Line 2:
In the first version each point receives random coordinates once at construction time.
In the first version each point receives random coordinates once at construction time.
<html>
<html>
<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>
<form><input type='button' value="Reload" onClick="reload();"></form>
<form><input type='button' value="Reload" onClick="reload();"></form>
<div id="box" class="jxgbox" style="width:400px; height:400px;"></div>
</html>
<script language="JavaScript">
 
        board = JXG.JSXGraph.initBoard('box', {originX: 10, originY:390 , unitX:380 , unitY: 380});
<jsxgraph box="box" width="400" height="400">
board = JXG.JSXGraph.initBoard('box', {boundingbox: [-0.02, 1.02, 1.02, -0.02]});
                  
                  
        function reload() {
function reload() {
            JXG.JSXGraph.freeBoard(board);         
    JXG.JSXGraph.freeBoard(board);         
            board = JXG.JSXGraph.initBoard('box', {originX: 10, originY: 390, unitX: 380, unitY: 380});          
    board = JXG.JSXGraph.initBoard('box', {boundingbox: [-0.02, 1.02, 1.02, -0.02]});


            board.suspendUpdate();
    board.suspendUpdate();
            for (var i=0;i<50;i++) {
    for (var i=0;i<50;i++) {
                var p = board.createElement('point',
        var p = board.createElement('point',
                      [Math.random(),Math.random()],{style:5,name:' '});
            [Math.random(),Math.random()],{style:5,name:' '});
            }
    }
            board.unsuspendUpdate();
    board.unsuspendUpdate();
        }
}
        reload();
reload();
</script>
</jsxgraph>
</html>


<source lang="javascript">
<source lang="javascript">
        board = JXG.JSXGraph.initBoard('box', {originX: 10, originY:390 , unitX:380 , unitY: 380});
board = JXG.JSXGraph.initBoard('box', {boundingbox: [-0.02, 1.02, 1.02, -0.02]});
                  
                  
        function reload() {
function reload() {
            JXG.JSXGraph.freeBoard(board);         
    JXG.JSXGraph.freeBoard(board);         
            board = JXG.JSXGraph.initBoard('box', {originX: 10, originY: 390, unitX: 380, unitY: 380});          
    board = JXG.JSXGraph.initBoard('box', {boundingbox: [-0.02, 1.02, 1.02, -0.02]});


            board.suspendUpdate();
    board.suspendUpdate();
            for (var i=0;i<50;i++) {
    for (var i=0;i<50;i++) {
                var p = board.createElement('point',
        var p = board.createElement('point',
                      [Math.random(),Math.random()],{style:5,name:' '});
            [Math.random(),Math.random()],{style:5,name:' '});
            }
    }
            board.unsuspendUpdate();
    board.unsuspendUpdate();
        }
}
        reload();
reload();
</source>
</source>


Line 46: Line 44:


Please, move the mouse pointer over this area:
Please, move the mouse pointer over this area:
<html>
<div id="box2" class="jxgbox" style="width:400px; height:400px;" onmousemove="board2.update()"></div>
<script language="JavaScript">
board2 = JXG.JSXGraph.initBoard('box2', {originX: 10, originY:390 , unitX:380 , unitY: 380});
board2.suspendUpdate();
for (var i=0;i<50;i++) {
  var p2 = board2.createElement('point',
          [function(){return Math.random();},function(){ return Math.random()}],
          {style:5,name:' '});
}
board2.unsuspendUpdate();
</script>
</html>


<source lang="html4strict">
<jsxgraph box="box2" width="400" height="400">
<div id="box2" class="jxgbox" style="width:400px; height:400px;" onmousemove="board2.update()"></div>
board2 = JXG.JSXGraph.initBoard('box2', {boundingbox: [-0.02, 1.02, 1.02, -0.02]});
</source>
board2.suspendUpdate();
for (var i=0;i<50;i++) {
    var p2 = board2.createElement('point', [function(){return Math.random();},function(){ return Math.random()}], {style:5,name:' '});
}
board2.unsuspendUpdate();
</jsxgraph>


<source lang="javascript">
<source lang="javascript">
board2 = JXG.JSXGraph.initBoard('box2', {originX: 10, originY:390 , unitX:380 , unitY: 380});
board2 = JXG.JSXGraph.initBoard('box', {boundingbox: [-0.02, 1.02, 1.02, -0.02]});
board2.suspendUpdate();
board2.suspendUpdate();
for (var i=0;i<50;i++) {
for (var i=0;i<50;i++) {
  var p2 = board2.createElement('point',
    var p2 = board2.createElement('point', [function(){return Math.random();},function(){ return Math.random()}], {style:5,name:' '});
          [function(){return Math.random();},function(){ return Math.random()}],
}
          {style:5,name:' '});
board2.unsuspendUpdate();
}
board2.unsuspendUpdate();
</source>
</source>


[[Category:Examples]]
[[Category:Examples]]
[[Category:Statistics]]
[[Category:Statistics]]

Revision as of 12:11, 8 June 2011

Draw 50 random points - version 1

In the first version each point receives random coordinates once at construction time.

board = JXG.JSXGraph.initBoard('box', {boundingbox: [-0.02, 1.02, 1.02, -0.02]});
                
function reload() {
    JXG.JSXGraph.freeBoard(board);        
    board = JXG.JSXGraph.initBoard('box', {boundingbox: [-0.02, 1.02, 1.02, -0.02]});

    board.suspendUpdate();
    for (var i=0;i<50;i++) {
        var p = board.createElement('point',
            [Math.random(),Math.random()],{style:5,name:' '});
    }
    board.unsuspendUpdate();
}
reload();

Draw 50 random points - version 2

Here, at construction time each point receives a function pair as coordinates. In each update these functions which return Math.random() are called. Thus in each update each point receives new random coordinates. The 50 points are updated on the onmousemove event.

Please, move the mouse pointer over this area:

board2 = JXG.JSXGraph.initBoard('box', {boundingbox: [-0.02, 1.02, 1.02, -0.02]});
board2.suspendUpdate();
for (var i=0;i<50;i++) {
    var p2 = board2.createElement('point', [function(){return Math.random();},function(){ return Math.random()}], {style:5,name:' '});
}
board2.unsuspendUpdate();