Difference between revisions of "Hypotrochoid"

From JSXGraph Wiki
Jump to: navigation, search
(New page: <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/pro...)
 
Line 27: Line 27:
 
</script>  
 
</script>  
 
</html>
 
</html>
 +
===The JavaScript code to produce this picture===
 +
<source lang="html4strict">
 +
<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/prototype.js"></script>
 +
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script>
 +
<div id="jsxgbox" class="jxgbox" style="width:500px; height:500px;"></div>
 +
</source>
 
<source lang="javascript">
 
<source lang="javascript">
 +
board = JXG.JSXGraph.initBoard('jsxgbox', {originX: 250, originY: 250, unitX: 50, unitY: 50});
 +
g1 = board.createElement('point', [1, -1], {style:6});
 +
g2 = board.createElement('point', [2.5, -2], {style:6});
 +
g3 = board.createElement('point', [1, -3], {style:5});
 +
g4 = board.createElement('point', [2.5, -4], {style:5});
 +
g5 = board.createElement('point', [-4, 1], {style:5,name:''});
 +
 +
c1 = board.createElement('curve', [
 +
      function(t){ return (g1.X()-g2.X())*Math.cos(t)+g3.X()*Math.cos(t*(g1.X()-g2.X())/g2.X()); },
 +
      function(t){ return (g1.X()-g2.X())*Math.sin(t)+g3.X()*Math.sin(t*(g1.X()-g2.X())/g2.X()); },
 +
      "t",0,function(){ return Math.PI*7*Math.abs(g4.X());}],{
 +
          strokeWidth:function(){return g5.Y()*3;},
 +
          strokeOpacity:function(){return g5.Y()*0.6;}
 +
        });
 +
 +
t = board.createElement('text', [function() { return g5.X()+0.2; },function() { return g5.Y()+0.25; },'X(B)=<value>X(B)</value>'],
 +
        {
 +
            digits:3,
 +
            fontSize:function(){return g5.Y()*10;}
 +
        });
 
</source>
 
</source>
  
 
[[Category:Examples]]
 
[[Category:Examples]]

Revision as of 13:22, 22 December 2008

The JavaScript code to produce this picture

<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/prototype.js"></script>
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script>
<div id="jsxgbox" class="jxgbox" style="width:500px; height:500px;"></div>
 board = JXG.JSXGraph.initBoard('jsxgbox', {originX: 250, originY: 250, unitX: 50, unitY: 50});
 g1 = board.createElement('point', [1, -1], {style:6});
 g2 = board.createElement('point', [2.5, -2], {style:6});
 g3 = board.createElement('point', [1, -3], {style:5});
 g4 = board.createElement('point', [2.5, -4], {style:5});
 g5 = board.createElement('point', [-4, 1], {style:5,name:''});

 c1 = board.createElement('curve', [
       function(t){ return (g1.X()-g2.X())*Math.cos(t)+g3.X()*Math.cos(t*(g1.X()-g2.X())/g2.X()); },
       function(t){ return (g1.X()-g2.X())*Math.sin(t)+g3.X()*Math.sin(t*(g1.X()-g2.X())/g2.X()); },
       "t",0,function(){ return Math.PI*7*Math.abs(g4.X());}],{
          strokeWidth:function(){return g5.Y()*3;},
          strokeOpacity:function(){return g5.Y()*0.6;}
         });

 t = board.createElement('text', [function() { return g5.X()+0.2; },function() { return g5.Y()+0.25; },'X(B)=<value>X(B)</value>'], 
        { 
            digits:3, 
            fontSize:function(){return g5.Y()*10;}
        });