Highlight curve via slider - Revision history

Michael at 07:15, 8 June 2011

2011-06-08T07:15:10Z

A WASSERMANN at 12:58, 2 June 2009

2009-06-02T12:58:42Z

A WASSERMANN at 12:17, 2 June 2009

2009-06-02T12:17:30Z

← Older revision		Revision as of 12:17, 2 June 2009
Line 2:		Line 2:
	<jsxgraph height="500" width="600" board="board" box="jxgbox">		<jsxgraph height="500" width="600" board="board" box="jxgbox">
	board = JXG.JSXGraph.initBoard('jxgbox', {originX: 250, originY: 250, unitX: 25, unitY: 25});		board = JXG.JSXGraph.initBoard('jxgbox', {originX: 250, originY: 250, unitX: 25, unitY: 25});
	var s = board.createElement('slider', [[1,8],[5,8],[0,0,1]]~~, {showLabel:false}~~);		var s = board.createElement('slider', [[1,8],[5,8],[0,0,1]]);

	var g = board.createElement('functiongraph', [function(x){ return x*x;}],		var g = board.createElement('functiongraph', [function(x){ return x*x;}],

A WASSERMANN at 12:17, 2 June 2009

2009-06-02T12:17:08Z

← Older revision		Revision as of 12:17, 2 June 2009
Line 2:		Line 2:
	<jsxgraph height="500" width="600" board="board" box="jxgbox">		<jsxgraph height="500" width="600" board="board" box="jxgbox">
	board = JXG.JSXGraph.initBoard('jxgbox', {originX: 250, originY: 250, unitX: 25, unitY: 25});		board = JXG.JSXGraph.initBoard('jxgbox', {originX: 250, originY: 250, unitX: 25, unitY: 25});
	var s = board.createElement('slider', [[1,8],[5,8],[0,0,1]]);		var s = board.createElement('slider', [[1,8],[5,8],[0,0,1]], {showLabel:false});

	var g = board.createElement('functiongraph', [function(x){ return x*x;}],		var g = board.createElement('functiongraph', [function(x){ return x*x;}],

A WASSERMANN at 12:16, 2 June 2009

2009-06-02T12:16:11Z

← Older revision		Revision as of 12:16, 2 June 2009
Line 1:		Line 1:
			Depending on the value of the slider ''s'', one of the curves is highlighted.
	<jsxgraph height="500" width="600" board="board" box="jxgbox">		<jsxgraph height="500" width="600" board="board" box="jxgbox">
	board = JXG.JSXGraph.initBoard('jxgbox', {originX: 250, originY: 250, unitX: 25, unitY: 25});		board = JXG.JSXGraph.initBoard('jxgbox', {originX: 250, originY: 250, unitX: 25, unitY: 25});
Line 6:		Line 7:
	{		{
	strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';},		strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';},
	strokeWidth:function(){ return (s.Value()<0.5)?3:1;},		strokeWidth:function(){ return (s.Value()<0.5)?4:1;},
	});		});
	var f = board.createElement('functiongraph', [function(x){ return x+1;}],		var f = board.createElement('functiongraph', [function(x){ return x+1;}],
	{		{
	strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';},		strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';},
	strokeWidth:function(){ return (s.Value()>=0.5)?3:1;},		strokeWidth:function(){ return (s.Value()>=0.5)?4:1;},
	});		});
	</jsxgraph>		</jsxgraph>

			===The underlying JavaScript code===
			<source lang="javascript">
			var s = board.createElement('slider', [[1,8],[5,8],[0,0,1]]);

			var g = board.createElement('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.createElement('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]]

A WASSERMANN at 12:13, 2 June 2009

2009-06-02T12:13:57Z

← Older revision		Revision as of 12:13, 2 June 2009
Line 6:		Line 6:
	{		{
	strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';},		strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';},
	strokeWidth:function(){ return (s.Value()>=0.5)?3:1;},		strokeWidth:function(){ return (s.Value()<0.5)?3:1;},
	});		});
	var f = board.createElement('functiongraph', [function(x){ return x+1;}],		var f = board.createElement('functiongraph', [function(x){ return x+1;}],

A WASSERMANN at 12:13, 2 June 2009

2009-06-02T12:13:36Z

← Older revision		Revision as of 12:13, 2 June 2009
Line 5:		Line 5:
	var g = board.createElement('functiongraph', [function(x){ return x*x;}],		var g = board.createElement('functiongraph', [function(x){ return x*x;}],
	{		{
	strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';}		strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';},
			strokeWidth:function(){ return (s.Value()>=0.5)?3:1;},
	});		});
	var f = board.createElement('functiongraph', [function(x){ return x+1;}],		var f = board.createElement('functiongraph', [function(x){ return x+1;}],
	{		{
	strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';}		strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';},
			strokeWidth:function(){ return (s.Value()>=0.5)?3:1;},
	});		});
	</jsxgraph>		</jsxgraph>

A WASSERMANN at 12:12, 2 June 2009

2009-06-02T12:12:28Z

← Older revision		Revision as of 12:12, 2 June 2009
Line 3:		Line 3:
	var s = board.createElement('slider', [[1,8],[5,8],[0,0,1]]);		var s = board.createElement('slider', [[1,8],[5,8],[0,0,1]]);

	var g = board.createElement('functiongraph', [function(x){ return x*x;}]		var g = board.createElement('functiongraph', [function(x){ return x*x;}],
	{		{
	strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';}		strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';}
	});		});
	var f = board.createElement('functiongraph', [function(x){ return x+1;}]		var f = board.createElement('functiongraph', [function(x){ return x+1;}],
	{		{
	strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';}		strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';}
	});		});
	</jsxgraph>		</jsxgraph>

A WASSERMANN at 12:12, 2 June 2009

2009-06-02T12:12:06Z

← Older revision		Revision as of 12:12, 2 June 2009
Line 1:		Line 1:
	<jsxgraph height="500" width="600" board="board" box="jxgbox">		<jsxgraph height="500" width="600" board="board" box="jxgbox">
	board = JXG.JSXGraph.initBoard('jxgbox', {originX: 250, originY: 250, unitX: 25, unitY: 25});		board = JXG.JSXGraph.initBoard('jxgbox', {originX: 250, originY: 250, unitX: 25, unitY: 25});
	var a = board.createElement('slider', [[1,8],[5,8],[0,1~~,4]]);~~		var s = board.createElement('slider', [[1,8],[5,8],[0,0,1]]);

	~~var g = board.createElement('functiongraph', [function(x){ return x*x;}~~]);
	~~var f = board.createElement('functiongraph', [function(x){ return x+1;}~~]);

			var g = board.createElement('functiongraph', [function(x){ return x*x;}]
			{
			strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';}
			});
			var f = board.createElement('functiongraph', [function(x){ return x+1;}]
			{
			strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';}
			});
	</jsxgraph>		</jsxgraph>

A WASSERMANN: New page: board = JXG.JSXGraph.initBoard('jxgbox', {originX: 250, originY: 250, unitX: 25, unitY: 25}); var a = board.createElement('s...

2009-06-02T12:09:44Z

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...

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('slider', [[1,8],[5,8],[0,1,4]]);

var g = board.createElement('functiongraph', [function(x){ return x*x;}]);
var f = board.createElement('functiongraph', [function(x){ return x+1;}]);

</jsxgraph>

← Older revision		Revision as of 07:15, 8 June 2011
Line 1:		Line 1:
	Depending on the value of the slider ''s'', one of the curves is highlighted.		Depending on the value of the slider ''s'', one of the curves is highlighted.
	<jsxgraph height="500" width="~~600~~" board="board" box="jxgbox">		<jsxgraph height="500" width="500" board="board" box="jxgbox">
	board = JXG.JSXGraph.initBoard('jxgbox', {~~originX~~: ~~250~~, ~~originY: 250~~, ~~unitX: 25~~, ~~unitY: 25~~});		board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-10, 10, 10, -10]});
	var s = board.~~createElement~~('slider', [[1,8],[5,8],[0,0,1]]);		var s = board.create('slider', [[1,8],[5,8],[0,0,1]]);

	var g = board.~~createElement~~('functiongraph', [function(x){ return x*x;}],		var g = board.create('functiongraph', [function(x){ return x*x;}],
	{		{
	strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';},		strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';},
	strokeWidth:function(){ return (s.Value()<0.5)?4:1;}		strokeWidth:function(){ return (s.Value()<0.5)?4:1;}
	});		});
	var f = board.~~createElement~~('functiongraph', [function(x){ return x+1;}],		var f = board.create('functiongraph', [function(x){ return x+1;}],
	{		{
	strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';},		strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';},
Line 18:		Line 18:
	===The underlying JavaScript code===		===The underlying JavaScript code===
	<source lang="javascript">		<source lang="javascript">
	var s = board.~~createElement~~('slider', [[1,8],[5,8],[0,0,1]]);		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.~~createElement~~('functiongraph', [function(x){ return x*x;}],		var g = board.create('functiongraph', [function(x){ return x*x;}],
	{		{
	strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';},		strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';},
	strokeWidth:function(){ return (s.Value()<0.5)?4:1;}		strokeWidth:function(){ return (s.Value()<0.5)?4:1;}
	});		});
	var f = board.~~createElement~~('functiongraph', [function(x){ return x+1;}],		var f = board.create('functiongraph', [function(x){ return x+1;}],
	{		{
	strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';},		strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';},

← Older revision		Revision as of 12:58, 2 June 2009
Line 7:		Line 7:
	{		{
	strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';},		strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';},
	strokeWidth:function(){ return (s.Value()<0.5)?4:1;},		strokeWidth:function(){ return (s.Value()<0.5)?4:1;}
	});		});
	var f = board.createElement('functiongraph', [function(x){ return x+1;}],		var f = board.createElement('functiongraph', [function(x){ return x+1;}],
	{		{
	strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';},		strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';},
	strokeWidth:function(){ return (s.Value()>=0.5)?4:1;},		strokeWidth:function(){ return (s.Value()>=0.5)?4:1;}
	});		});
	</jsxgraph>		</jsxgraph>
Line 23:		Line 23:
	{		{
	strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';},		strokeColor:function(){ return (s.Value()<0.5)?'red':'blue';},
	strokeWidth:function(){ return (s.Value()<0.5)?4:1;},		strokeWidth:function(){ return (s.Value()<0.5)?4:1;}
	});		});
	var f = board.createElement('functiongraph', [function(x){ return x+1;}],		var f = board.createElement('functiongraph', [function(x){ return x+1;}],
	{		{
	strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';},		strokeColor:function(){ return (s.Value()>=0.5)?'red':'blue';},
	strokeWidth:function(){ return (s.Value()>=0.5)?4:1;},		strokeWidth:function(){ return (s.Value()>=0.5)?4:1;}
	});		});
	</source>		</source>

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