1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55
|
<html>
<head>
<title>JSXGraph example</title>
<link rel="stylesheet" type="text/css" href="../distrib/jsxgraph.css" />
<script type="text/javascript" src="../distrib/jsxgraphcore.js"></script>
</head>
<body>
<h1>Playground</h1>
<form>Riemann sum type: <select id="sumtype">
<option value='left' selected> left
<option value='right'> right
<option value='middle'> middle
<option value='trapezodial'> trapezodial
<option value='lower'> lower
<option value='upper'> upper
<option value='random'> random
</select></form>
<!-- Drawing area -->
<div id="box" class="jxgbox" style="width:800px; height:400px; overflow:hidden; /*position:absolute; top:0px; left:0px;*/"></div>
<!-- Drawing area -->
<div id="debug" style="display:block;"></div>
<script type="text/javascript">
/* <![CDATA[ */
var brd = JXG.JSXGraph.initBoard('box', {axis:true, originX: 400, originY: 200, grid:true, unitX: 50, unitY: 50});
//brd.suspendUpdate();
var s = brd.create('slider',[[1,3],[5,3],[1,10,50]],{name:'n', snapWidth:1, withLabel:true});
var a = brd.create('slider',[[1,2],[5,2],[-10,-2*Math.PI,0]],{name:'start', snapWidth:0.25});
var b = brd.create('slider',[[1,1],[5,1],[0,Math.PI,10]],{name:'end'});
var f = function(x){ return Math.sin(x); }
var plot = brd.create('functiongraph',[f,function(){return a.Value();}, function(){return b.Value();}]);
brd.unsuspendUpdate();
var os = brd.create('riemannsum',[f,
function(){ return s.Value();}, function(){ return document.getElementById('sumtype').value;},
function(){return a.Value();},
function(){return b.Value();}
],
{fillColor:'#ffff00', fillOpacity:0.3});
brd.create('text',[-6,-3,function(){
return 'Sum=' +(JXG.Math.Numerics.riemannsum(f,s.Value(),document.getElementById('sumtype').value,a.Value(),b.Value())).toFixed(4); }
],{fontSize:40});
brd.create('text',[1,-3,function(){
return 'Sum=' + os.Value().toFixed(4); }
],{fontSize:40});
//brd.createElement('text',[-6,-3,function(){ return 'Sum='+(brd.riemannsum(f,s.Value(),'trapezodial',a.Value(),b.Value())).toFixed(2); }],{fontSize:40});
/* ]]> */
</script>
</body>
</html>
|