Reflect images: Difference between revisions
From JSXGraph Wiki
A WASSERMANN (talk | contribs) No edit summary |
A WASSERMANN (talk | contribs) No edit summary Tag: Reverted |
||
Line 1: | Line 1: | ||
<jsxgraph width="600" height="500"> | <jsxgraph width="600" height="500"> | ||
(function(){ | (function(){ | ||
var board = JXG.JSXGraph.initBoard('jxgbox', { | |||
boundingbox: [-5, 5, 13, -2.5], | |||
grid: true | |||
}); | |||
var p0, p1, p2, p3, p4, p5, | |||
l1, l2, | |||
im1, im2, im3, | |||
t1, t2, | |||
imurl = "./uccellino.jpg", | |||
X, Y, W, H; // Functions defining the position, width and height of the original image. | |||
// Define two line through four points | |||
p0 = board.create('point', [2, -2]); | |||
p1 = board.create('point', [2, 1]); | |||
p2 = board.create('point', [10, -1]); | |||
l1 = board.create('line', [p0, p1]); | |||
l2 = board.create('line', [p1, p2]); | |||
p4 = board.create('point', [-2, -2]); | |||
p5 = board.create('point', [1, 0]); | |||
X = function () { return Math.min(p4.X(), p5.X()); }; | |||
Y = function () { return Math.min(p4.Y(), p5.Y()); }; | |||
W = function () { return Math.abs(p5.X() - p4.X()); }; | |||
H = function () { return Math.abs(p5.Y() - p4.Y()); }; | |||
im1 = board.create('image', [imurl, [X, Y], [W, H]], { opacity: 0.7 }); | |||
im2 = board.create('image', [imurl, [X, Y], [W, H]], { opacity: 0.7 }); | |||
im3 = board.create('image', [imurl, [X, Y], [W, H]], { opacity: 0.7 }); | |||
t1 = board.create('transform', [l1], { type: 'reflect' }); | |||
t2 = board.create('transform', [l2], { type: 'reflect' }); | |||
// Reflect im2 on l1 | |||
t1.bindTo(im2); | |||
// Reflect im3 on l1 and on l2 | |||
t1.bindTo(im3); | |||
t2.bindTo(im3); | |||
board.update(); | |||
})(); | })(); |
Revision as of 06:01, 16 September 2024
<jsxgraph width="600" height="500"> (function(){
var board = JXG.JSXGraph.initBoard('jxgbox', { boundingbox: [-5, 5, 13, -2.5], grid: true }); var p0, p1, p2, p3, p4, p5, l1, l2, im1, im2, im3, t1, t2, imurl = "./uccellino.jpg", X, Y, W, H; // Functions defining the position, width and height of the original image.
// Define two line through four points p0 = board.create('point', [2, -2]); p1 = board.create('point', [2, 1]); p2 = board.create('point', [10, -1]);
l1 = board.create('line', [p0, p1]); l2 = board.create('line', [p1, p2]);
p4 = board.create('point', [-2, -2]); p5 = board.create('point', [1, 0]);
X = function () { return Math.min(p4.X(), p5.X()); }; Y = function () { return Math.min(p4.Y(), p5.Y()); }; W = function () { return Math.abs(p5.X() - p4.X()); }; H = function () { return Math.abs(p5.Y() - p4.Y()); };
im1 = board.create('image', [imurl, [X, Y], [W, H]], { opacity: 0.7 }); im2 = board.create('image', [imurl, [X, Y], [W, H]], { opacity: 0.7 }); im3 = board.create('image', [imurl, [X, Y], [W, H]], { opacity: 0.7 });
t1 = board.create('transform', [l1], { type: 'reflect' }); t2 = board.create('transform', [l2], { type: 'reflect' });
// Reflect im2 on l1 t1.bindTo(im2);
// Reflect im3 on l1 and on l2 t1.bindTo(im3); t2.bindTo(im3);
board.update();
})(); </source>