Copy link to clipboard
Copied
Hello,
I have the following code to draw a line from a drawn clip called my_circle. I would like the line to be drawn in a window of fixed size (L = 500, H = 250) and that the content of this window moves to the left in order to make a sinusoid-shaped line appear, like a heart rate recording would. I managed to do this in AS2 with a mask and a "createEmptyMovieClip". I've been looking for many hours and I can't find it. Would you please have a solution in HTML5?
this.my_circle.x = 800;
this.my_circle.y = 100;
createjs.Tween.get(this.my_circle, {loop: -1})
.to({x:800, y: 200}, 2000)
.wait(200)
.to({x:800, y: 100}, 2000)
var ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.strokeStyle = '#ff0000';
ctx.lineWidth = 2;
createjs.Ticker.addEventListener("tick", tick1.bind(this));
function tick1()
{
var pmj = this.globalToLocal(this.my_circle.x,this.my_circle.y);
posXu = pmj.x;
posYu = pmj.y;
ctx.lineTo(posXu,posYu);
ctx.stroke();
};
tick1();
ctx.moveTo(posXu,posYu );
Thank you for any answer.
Translated with www.DeepL.com/Translator (free version)
Have something to add?