Highlight curve via slider: Difference between revisions
From JSXGraph Wiki
A WASSERMANN (talk | contribs) (New page: <jsxgraph height="500" width="600" board="board" box="jxgbox"> board = JXG.JSXGraph.initBoard('jxgbox', {originX: 250, originY: 250, unitX: 25, unitY: 25}); var a = board.createElement('s...) |
No edit summary |
||
(8 intermediate revisions by one other user not shown) | |||
Line 1: | Line 1: | ||
<jsxgraph height="500" width=" | Depending on the value of the slider ''s'', one of the curves is highlighted. | ||
board = JXG.JSXGraph.initBoard('jxgbox', { | <jsxgraph height="500" width="500" board="board" box="jxgbox"> | ||
var | board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-10, 10, 10, -10]}); | ||
var s = board.create('slider', [[1,8],[5,8],[0,0,1]]); | |||
var g = board. | var g = board.create('functiongraph', [function(x){ return x*x;}], | ||
var f = board. | { | ||
strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';}, | |||
strokeWidth:function(){ return (s.Value()<0.5)?4:1;} | |||
}); | |||
var f = board.create('functiongraph', [function(x){ return x+1;}], | |||
{ | |||
strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';}, | |||
strokeWidth:function(){ return (s.Value()>=0.5)?4:1;} | |||
}); | |||
</jsxgraph> | |||
===The underlying JavaScript code=== | |||
<source lang="javascript"> | |||
board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-10, 10, 10, -10]}); | |||
var s = board.create('slider', [[1,8],[5,8],[0,0,1]]); | |||
var g = board.create('functiongraph', [function(x){ return x*x;}], | |||
{ | |||
strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';}, | |||
strokeWidth:function(){ return (s.Value()<0.5)?4:1;} | |||
}); | |||
var f = board.create('functiongraph', [function(x){ return x+1;}], | |||
{ | |||
strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';}, | |||
strokeWidth:function(){ return (s.Value()>=0.5)?4:1;} | |||
}); | |||
</source> | |||
[[Category:Examples]] |
Latest revision as of 07:15, 8 June 2011
Depending on the value of the slider s, one of the curves is highlighted.
The underlying JavaScript code
board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-10, 10, 10, -10]});
var s = board.create('slider', [[1,8],[5,8],[0,0,1]]);
var g = board.create('functiongraph', [function(x){ return x*x;}],
{
strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';},
strokeWidth:function(){ return (s.Value()<0.5)?4:1;}
});
var f = board.create('functiongraph', [function(x){ return x+1;}],
{
strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';},
strokeWidth:function(){ return (s.Value()>=0.5)?4:1;}
});