Skip to main content
O
otherelse
Participant
June 12, 2019
Answered

javascript in animate

  • June 12, 2019
  • 2 replies
  • 549 views

Why this does not show in Chrome browser?

Note: I dont want to use createjs // my problem is in pure js

this seems to be not needed in Animate.   Why???

//var canvas = document.getElementById('canvas');

var ctx = canvas.getContext('2d');

var x1 = 400, x2 = 300, y1 = 300, y2 = 50

ctx.lineWidth = 7;

ctx.beginPath();

ctx.strokeStyle='red';

ctx.moveTo(x1, y1);

ctx.lineTo(x2, y2);

ctx.lineTo(x1, y2);

ctx.lineTo(x2, y1);

ctx.stroke()

ctx.fillStyle = "blue";

ctx.fill();

This topic has been closed for replies.
Correct answer ClayUUID

Are you saying the above code works in other browsers but not Chrome?

It shouldn't work in any browser, because CreateJS clears and repaints the entire canvas every frame. Of course anything you manually draw to it will get clobbered. CreateJS owns the canvas. If you want to draw on it, you'll have to use CreateJS to do it.

this seems to be not needed in Animate.   Why???

//var canvas = document.getElementById('canvas');

Because Animate already does exactly that in the first line of the init() function that it generates.

2 replies

kdmemory
kdmemory
Inspiring
June 15, 2019

Hi otherelse

ClayUUID is right, CreateJS owns the canvas. At least in Animate.

It seems to me that you should study the Graphics Class in EaselJS (most important module of CreateJS).

"Note: I dont want to use createjs // my problem is in pure js"

Na, na - thats a pure intention but won't help you when you are in Animate. The whole Animate/HTML5/Canvas business means CreateJS. That's a library to ease the dealings with HTML5 Canvas. Things like

var ctx = canvas.getContext('2d');

are not necessary in the context of Animate and CreateJS.

And the line

var x1 = 400, x2 = 300, y1 = 300, y2 = 50

should end with semicolon.

Klaus

C
ClayUUIDCorrect answer
Legend
June 12, 2019

Are you saying the above code works in other browsers but not Chrome?

It shouldn't work in any browser, because CreateJS clears and repaints the entire canvas every frame. Of course anything you manually draw to it will get clobbered. CreateJS owns the canvas. If you want to draw on it, you'll have to use CreateJS to do it.

this seems to be not needed in Animate.   Why???

//var canvas = document.getElementById('canvas');

Because Animate already does exactly that in the first line of the init() function that it generates.

Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices