Curve: Difference between revisions
From JSXGraph Wiki
No edit summary |
No edit summary |
||
| Line 22: | Line 22: | ||
axisx = b.createElement('axis', [[1,0], [0,0]], {}); | axisx = b.createElement('axis', [[1,0], [0,0]], {}); | ||
axisy = b.createElement('axis', [[0,1], [0,0]], {}); | axisy = b.createElement('axis', [[0,1], [0,0]], {}); | ||
</script> | |||
</html> | |||
Now we can plot for example a sine curve from -π to π. | |||
<source lang="javascript"> | |||
b.createElement('curve', ['x',function(x){return Math.sin(x);},'x',-Math.PI,2*Math.PI],{curveType:'plot'}); | |||
</source> | |||
<html> | |||
<div id="jxgbox2" class="jxgbox" style="width:600px; height:400px;"></div> | |||
<script type="text/javascript"> | |||
var b2 = JXG.JSXGraph.initBoard('jxgbox2', {originX: 200, originY: 200, unitX: 20, unitY: 20}); | |||
axisx = b2.createElement('axis', [[1,0], [0,0]], {}); | |||
axisy = b2.createElement('axis', [[0,1], [0,0]], {}); | |||
b2.createElement('curve', ['x',function(x){return Math.sin(x);},'x',-Math.PI,2*Math.PI],{curveType:'plot'}); | |||
</script> | </script> | ||
</html> | </html> | ||
Revision as of 08:51, 19 September 2008
There are various possibilities to display curves and plots. JSXGraph supports the following curve types which can be set by changing the property "curveType". In many cases JSXGraph can guess the curveType from the input parameters, but sometimes the curveType has to be set explicitly.
- 'plot': function plotter
- 'parameter': parameter curves.
- 'graph': data plot
- 'polar': polar curves
Function plotter - curveType:'plot'
First, we initialize the board and set axes:
var b = JXG.JSXGraph.initBoard('jxgbox', {originX: 200, originY: 200, unitX: 20, unitY: 20});
axisx = b.createElement('axis', [[1,0], [0,0]], {});
axisy = b.createElement('axis', [[0,1], [0,0]], {});
Now we can plot for example a sine curve from -π to π.
b.createElement('curve', ['x',function(x){return Math.sin(x);},'x',-Math.PI,2*Math.PI],{curveType:'plot'});
