Shear transformation: Difference between revisions

From JSXGraph Wiki
No edit summary
No edit summary
Line 32: Line 32:
var l1 = board.create('line', [q, qx], {visible: false});
var l1 = board.create('line', [q, qx], {visible: false});


var p = board.create('glider', [1, 3, l1], {name: 'p'});
var r1 = board.create('line', [[0, 0], q], {straightFirst: false, strokewidth: 1});
 
var p = board.create('glider', [1, 3, r1], {name: 'p'});
var p1 = board.create('point', [
var p1 = board.create('point', [
         () => p.X() + p.Y(),
         () => p.X() + p.Y(),
Line 38: Line 40:
     ], {name: 'φ(p)'});
     ], {name: 'φ(p)'});


var r1 = board.create('line', [[0, 0], q1], {straightFirst: false, strokewidth: 1});
var r2 = board.create('line', [[0, 0], q1], {straightFirst: false, strokewidth: 1});


</jsxgraph>
</jsxgraph>

Revision as of 07:24, 31 May 2021

Shear transformation

[math]\displaystyle{ \varphi: {\cal A}(\mathbb{R}^2) \to {\cal A}(\mathbb{R}^2), \; x \mapsto \begin{pmatrix}1 & 1 \\ 0& 1\end{pmatrix} }[/math]

Points of the form [math]\displaystyle{ {x\choose \lambda} }[/math] are mapped to:

[math]\displaystyle{ \varphi({x\choose \lambda}) = {x + \lambda\choose} }[/math]

The underlying JavaScript code

JXG.Options.label.autoPosition = true;
JXG.Options.text.fontSize = 20;
var board = JXG.JSXGraph.initBoard('jxgbox', { boundingbox: [-10, 10, 10, -10], axis: true});

var x = board.defaultAxes.x;
var y = board.defaultAxes.y;

var q = board.create('point', [1, 2], {name: 'q', snapToGrid: true});
var q1 = board.create('point', [
        () => q.X() + q.Y(),
        () => q.Y()
    ], {name: '&phi;(q)'});

var qx = board.create('point', [
        () => q.X(),
        () => 0
    ], {visible: false});

var s1 = board.create('segment', [q, q1], {dash:2});
var s2 = board.create('segment', [qx, q], {dash:2});