Infinity: Difference between revisions

From JSXGraph Wiki
No edit summary
No edit summary
 
(14 intermediate revisions by 2 users not shown)
Line 1: Line 1:
Here [http://jquery.com jQuery] is used instead of [http://prototypejs.org Prototype].
== Just enjoy this construction... ==
== Just enjoy this construction... ==
<html>
<jsxgraph box="jxgbox" width="800" height="700">
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" />
  var brd = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-6, 6, 10, -8]});
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jquery.min.js"></script>
  brd.suspendUpdate();
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script>
  var S = brd.create('slider', [[-5,-6],[5,-6],[0,0.95,1]], {name:'S'});
<div id="jxgbox" class="jxgbox" style="width:800px; height:700px;"></div>
  var hue = brd.create('slider', [[-5,-7],[5,-7],[0,8,36]], {name:'color'});
<script language="JavaScript">
  var board = JXG.JSXGraph.initBoard('jxgbox', {originX: 300, originY: 300, unitX: 50, unitY: 50});
  board.suspendUpdate();
  var S = board.createElement('slider', [[-5,-6],[5,-6],[0,0.95,1]], {name:'S'});
  var hue = board.createElement('slider', [[-5,-7],[5,-7],[0,8,16]], {name:'color'});
  var points = new Array();
  var points = new Array();
  points[0] = board.createElement('point',[5, 5], {name:' '});
  points[0] = brd.create('point',[5, 5], {name:' '});  
  points[1] = board.createElement('point',[-5, 5], {name:' '});
  points[1] = brd.create('point',[-5, 5], {name:' '});
  points[2] = board.createElement('point',[-5, -5], {name:' '});
  points[2] = brd.create('point',[-5, -5], {name:' '});  
  points[3] = board.createElement('point',[5, -5], {name:' '});
  points[3] = brd.create('point',[5, -5], {name:' '});
  function quadrangle(pt, n) {
  function quadrangle(pt, n) {
   var col;
   var col;
   var arr = new Array();
   var arr = new Array();
   for(var i = 0; i < 4; i++) {
   for(var i = 0; i < 4; i++) {
   arr[i] = board.createElement('point',  
   arr[i] = brd.create('point',  
         [function(t) {
         [function(t) {
             return function () {var x = pt[t].X();  
             return function () {var x = pt[t].X();  
Line 35: Line 29:
                         }}(i)
                         }}(i)
           ],  
           ],  
           {style:3, name:" "});
           {size:1, name:"",withLabel:false,visible:false});
   }
   }
  //board.createElement('polygon',pt, {fillColor: '#5555'+n+''+n});
   col =  function(){return JXG.hsv2rgb(hue.Value()*n,0.7,0.9);};
   col =  function(){return JXG.hsv2rgb(hue.Value()*n,0.7,0.9);};
   board.createElement('polygon',pt, {fillColor:col});
   brd.create('polygon',pt, {fillColor:col});
   if(n>0)
   if(n>0)
     quadrangle(arr, --n);
     quadrangle(arr, --n);
  }
  }
  quadrangle(points,30);
  quadrangle(points,30);
  board.unsuspendUpdate();
  brd.unsuspendUpdate();
</script>  
</jsxgraph>  
</html>
 
<source lang="xml">
<source lang="javascript">
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" />
var brd = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-6, 6, 10, -8]});
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jquery.min.js"></script>
brd.suspendUpdate();
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script>
var S = brd.create('slider', [[-5,-6],[5,-6],[0,0.95,1]], {name:'S'});
<div id="jxgbox" class="jxgbox" style="width:800px; height:700px;"></div>
var hue = brd.create('slider', [[-5,-7],[5,-7],[0,8,36]], {name:'color'});
<script language="JavaScript">
var points = new Array();
var board = JXG.JSXGraph.initBoard('jxgbox', {originX: 300, originY: 300, unitX: 50, unitY: 50})
points[0] = brd.create('point',[5, 5], {name:' '});  
var S = board.createElement('slider', [[-5,-6],[5,-6],[0,0.5,1]], {name:'S'});
points[1] = brd.create('point',[-5, 5], {name:' '});
var points = new Array();
points[2] = brd.create('point',[-5, -5], {name:' '});  
points[0] = board.createElement('point',[5, 5], {name:' '});
points[3] = brd.create('point',[5, -5], {name:' '});
points[1] = board.createElement('point',[-5, 5], {name:' '});
points[2] = board.createElement('point',[-5, -5], {name:' '});
function quadrangle(pt, n) {
points[3] = board.createElement('point',[5, -5], {name:' '});
    var col;
    var arr = new Array();
function quadrangle(pt, n) {
    for(var i = 0; i < 4; i++) {
  var arr = new Array();
        arr[i] = brd.create('point',  
  for(var i = 0; i < 4; i++) {
            [function(t) {
  arr[i] = board.createElement('point',  
                return function () {var x = pt[t].X();  
        [function(t) {
            return function () {var x = pt[t].X();  
                                 var x1 = pt[(t+1)%4].X();  
                                 var x1 = pt[(t+1)%4].X();  
                                 var s = S.Value();
                                 var s = S.Value();
                                 return x+(x1-x)*s;
                                 return x+(x1-x)*s;
                         }}(i),  
                         }}(i),  
          function(t) {
            function(t) {
            return function () {var y = pt[t].Y();  
                return function () {var y = pt[t].Y();  
                                 var y1 = pt[(t+1)%4].Y();  
                                 var y1 = pt[(t+1)%4].Y();  
                                 var s = S.Value();
                                 var s = S.Value();
                                 return y+(y1-y)*s;
                                 return y+(y1-y)*s;
                         }}(i)
                         }}(i)
          ],  
            ],  
          {style:3, name:" "});
            {size:1, name:"",withLabel:false,visible:false});
  }
    }
  board.createElement('polygon',pt, {fillColor: '#5555'+n+''+n});
    col =  function(){return JXG.hsv2rgb(hue.Value()*n,0.7,0.9);};
  if(n>0)
    brd.create('polygon',pt, {fillColor:col});
    quadrangle(arr, --n);
    if(n>0)
}
        quadrangle(arr, --n);
board.suspendUpdate();
  }
quadrangle(points,30);
quadrangle(points,30);
board.unsuspendUpdate();
brd.unsuspendUpdate();
</script>
</source>
</source>


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

Latest revision as of 10:48, 17 January 2012

Just enjoy this construction...

var brd = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-6, 6, 10, -8]});
brd.suspendUpdate();
var S = brd.create('slider', [[-5,-6],[5,-6],[0,0.95,1]], {name:'S'});
var hue = brd.create('slider', [[-5,-7],[5,-7],[0,8,36]], {name:'color'});
var points = new Array();
points[0] = brd.create('point',[5, 5], {name:' '});   
points[1] = brd.create('point',[-5, 5], {name:' '});  
points[2] = brd.create('point',[-5, -5], {name:' '}); 
points[3] = brd.create('point',[5, -5], {name:' '});  
 
function quadrangle(pt, n) {
    var col;
    var arr = new Array();
    for(var i = 0; i < 4; i++) {
        arr[i] = brd.create('point', 
            [function(t) {
                return function () {var x = pt[t].X(); 
                                var x1 = pt[(t+1)%4].X(); 
                                var s = S.Value();
                                return x+(x1-x)*s;
                         }}(i), 
             function(t) {
                return function () {var y = pt[t].Y(); 
                                var y1 = pt[(t+1)%4].Y(); 
                                var s = S.Value();
                                return y+(y1-y)*s;
                         }}(i)
            ], 
            {size:1, name:"",withLabel:false,visible:false});
    }
    col =  function(){return JXG.hsv2rgb(hue.Value()*n,0.7,0.9);};
    brd.create('polygon',pt, {fillColor:col});
    if(n>0)
        quadrangle(arr, --n);
   }
quadrangle(points,30);
brd.unsuspendUpdate();