Affine normalform of parabola: Difference between revisions
From JSXGraph Wiki
A WASSERMANN (talk | contribs) (Created page with " <jsxgraph width="500" height="500"> JXG.Options.label.autoPosition = true; JXG.Options.text.fontSize = 20; JXG.Options.line.strokeWidth = 1; var board = JXG.JSXGraph.initBoa...") |
A WASSERMANN (talk | contribs) No edit summary |
||
(17 intermediate revisions by the same user not shown) | |||
Line 2: | Line 2: | ||
<jsxgraph width="500" height="500"> | <jsxgraph width="500" height="500"> | ||
JXG.Options.label.autoPosition = true; | JXG.Options.label.autoPosition = true; | ||
JXG.Options.text.fontSize = | JXG.Options.text.fontSize = 16; | ||
JXG.Options.line.strokeWidth = 1; | JXG.Options.line.strokeWidth = 1; | ||
var board = JXG.JSXGraph.initBoard('jxgbox', { boundingbox: [- | var board = JXG.JSXGraph.initBoard('jxgbox', { boundingbox: [-2, 5, 8, -5], axis: true, showClearTraces: true}); | ||
var a = board.create('slider', [[ | var a = board.create('slider', [[3,4], [6,4], [-4, 2, 4]], {name: 'a'}); | ||
var b = board.create('slider', [[ | var b = board.create('slider', [[3,3.5],[6,3.5], [-4, 1, 4]], {name: 'b'}); | ||
var c = board.create('slider', [[ | var c = board.create('slider', [[3,3], [6,3], [-4, 1, 4]], {name: 'c'}); | ||
var d = board.create('slider', [[ | var d = board.create('slider', [[3,2.5],[6,2.5], [-4, -1, 4]], {name: 'd'}); | ||
var Q3 = board.create('functiongraph', ['x^2']); | |||
var x = board.create('glider', [2, 4, Q3], {name:'x', trace:true}); | |||
var t = board.create('point', [1, 0], {name:'t'}); | |||
board.create('arrow', [[0,0], t]); | |||
var y = board.create('point', [ | |||
() => a.Value() * x.X() + b.Value() * x.Y() + t.X(), | |||
() => c.Value() * x.X() + d.Value() * x.Y() + t.Y() | |||
], {name: 'y', color:'orange', trace: true}); | |||
</jsxgraph> | </jsxgraph> | ||
Line 17: | Line 26: | ||
<source lang="javascript"> | <source lang="javascript"> | ||
JXG.Options.label.autoPosition = true; | |||
JXG.Options.text.fontSize = 16; | |||
JXG.Options.line.strokeWidth = 1; | |||
var board = JXG.JSXGraph.initBoard('jxgbox', { boundingbox: [-2, 5, 8, -5], axis: true, showClearTraces: true}); | |||
var a = board.create('slider', [[3,4], [6,4], [-4, 2, 4]], {name: 'a'}); | |||
var b = board.create('slider', [[3,3.5],[6,3.5], [-4, 1, 4]], {name: 'b'}); | |||
var c = board.create('slider', [[3,3], [6,3], [-4, 1, 4]], {name: 'c'}); | |||
var d = board.create('slider', [[3,2.5],[6,2.5], [-4, -1, 4]], {name: 'd'}); | |||
var Q3 = board.create('functiongraph', ['x^2']); | |||
var x = board.create('glider', [2, 4, Q3], {name:'x', trace:true}); | |||
var t = board.create('point', [1, 0], {name:'t'}); | |||
board.create('arrow', [[0,0], t]); | |||
var y = board.create('point', [ | |||
() => a.Value() * x.X() + b.Value() * x.Y() + t.X(), | |||
() => c.Value() * x.X() + d.Value() * x.Y() + t.Y() | |||
], {name: 'y', color:'orange', trace: true}); | |||
</source> | </source> | ||
[[Category:Examples]] | [[Category:Examples]] | ||
[[Category:Geometry]] | [[Category:Geometry]] |
Latest revision as of 19:53, 6 June 2021
The underlying JavaScript code
JXG.Options.label.autoPosition = true;
JXG.Options.text.fontSize = 16;
JXG.Options.line.strokeWidth = 1;
var board = JXG.JSXGraph.initBoard('jxgbox', { boundingbox: [-2, 5, 8, -5], axis: true, showClearTraces: true});
var a = board.create('slider', [[3,4], [6,4], [-4, 2, 4]], {name: 'a'});
var b = board.create('slider', [[3,3.5],[6,3.5], [-4, 1, 4]], {name: 'b'});
var c = board.create('slider', [[3,3], [6,3], [-4, 1, 4]], {name: 'c'});
var d = board.create('slider', [[3,2.5],[6,2.5], [-4, -1, 4]], {name: 'd'});
var Q3 = board.create('functiongraph', ['x^2']);
var x = board.create('glider', [2, 4, Q3], {name:'x', trace:true});
var t = board.create('point', [1, 0], {name:'t'});
board.create('arrow', [[0,0], t]);
var y = board.create('point', [
() => a.Value() * x.X() + b.Value() * x.Y() + t.X(),
() => c.Value() * x.X() + d.Value() * x.Y() + t.Y()
], {name: 'y', color:'orange', trace: true});