Animation III: Difference between revisions
From JSXGraph Wiki
A WASSERMANN (talk | contribs) No edit summary  | 
				A WASSERMANN (talk | contribs) No edit summary  | 
				||
| (12 intermediate revisions by the same user not shown) | |||
| Line 2: | Line 2: | ||
brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-0.2,1.2,1.2,-0.5], keepaspectratio:true});  | brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-0.2,1.2,1.2,-0.5], keepaspectratio:true});  | ||
p = [];  | p = [];  | ||
len =   | len = 25;  | ||
for (i=0;i<len;i++) {  | for (i=0;i<len;i++) {  | ||
     p[i] = brd.  |      p[i] = brd.create('point',[Math.random(),Math.random()],  | ||
                {face:'o', size:  |                 {face:'o', size:10, strokeColor:'red', fillColor:'red', fillOpacity:0.4, strokeOpacity:0.4, withLabel:false});  | ||
}  | }  | ||
setInterval(function(){  | setInterval(function(){  | ||
    var i;  |     var i, j;  | ||
    for (i=0;i<p.length;i++) {  |     for (i=0;i<p.length;i++) {  | ||
        p.moveTo([Math.random(),  |         p[i].moveTo([Math.random(),Math.random()],1000);  | ||
    }  |     }  | ||
},  |    i = 0;  | ||
   while (i<p.length) {  | |||
       for (j=i+1;j<p.length;j++) {  | |||
           if (p[i].Dist(p[j])<0.075) {  | |||
               brd.removeObject(p[j]);  | |||
               p.splice(j,1);  | |||
               brd.removeObject(p[i]);  | |||
               p.splice(i,1);  | |||
               i--;  | |||
               break;  | |||
           }   | |||
       }  | |||
       i++;  | |||
   }  | |||
},2000);  | |||
</jsxgraph>  | </jsxgraph>  | ||
===The underlying JavaScript code===  | |||
<source lang="javascript">  | |||
brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-0.2,1.2,1.2,-0.5], keepaspectratio:true});  | |||
p = [];  | |||
len = 25;  | |||
for (i=0;i<len;i++) {  | |||
    p[i] = brd.create('point',[Math.random(),Math.random()],  | |||
               {face:'o', size:10, strokeColor:'red', fillColor:'red', fillOpacity:0.4, strokeOpacity:0.4, withLabel:false});  | |||
}  | |||
setInterval(function(){  | |||
   var i, j;  | |||
   for (i=0;i<p.length;i++) {  | |||
       p[i].moveTo([Math.random(),Math.random()],1000);  | |||
   }  | |||
   i = 0;  | |||
   while (i<p.length) {  | |||
       for (j=i+1;j<p.length;j++) {  | |||
           if (p[i].Dist(p[j])<0.075) {  | |||
               brd.removeObject(p[j]);  | |||
               p.splice(j,1);  | |||
               brd.removeObject(p[i]);  | |||
               p.splice(i,1);  | |||
               i--;  | |||
               break;  | |||
           }   | |||
       }  | |||
       i++;  | |||
   }  | |||
},2000);  | |||
</source>  | |||
[[Category:Examples]]  | |||
Latest revision as of 11:28, 12 November 2020
The underlying JavaScript code
brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-0.2,1.2,1.2,-0.5], keepaspectratio:true});
p = [];
len = 25;
for (i=0;i<len;i++) {
    p[i] = brd.create('point',[Math.random(),Math.random()],
               {face:'o', size:10, strokeColor:'red', fillColor:'red', fillOpacity:0.4, strokeOpacity:0.4, withLabel:false});
}
setInterval(function(){
   var i, j;
   for (i=0;i<p.length;i++) {
       p[i].moveTo([Math.random(),Math.random()],1000);
   }
   i = 0;
   while (i<p.length) {
       for (j=i+1;j<p.length;j++) {
           if (p[i].Dist(p[j])<0.075) {
               brd.removeObject(p[j]);
               p.splice(j,1);
               brd.removeObject(p[i]);
               p.splice(i,1);
               i--;
               break;
           } 
       }
       i++;
   }
},2000);