FAQ Database Discussion Community


Size limitation when drawing to CanvasRenderingContext2D

html5-canvas,easeljs,createjs
I HAVE HEAVILY EDITED THIS QUESTION TO PROVIDE MORE DETAILS I came across a limitation when drawing to CanvasRenderingContext2D via EaselJS framework. I have objects like this: but when the position of those objects surpasses couple million pixels the drawings start to crumble apart. This is the same object with...

Can a easeljs hitarea be set using image data?

javascript,png,easeljs
I'd like to be able to set set the hit area of my Display objects using image data instead of a Shape object. However setting the hitarea property of my objects doesn't seem to be working. Here's an example of what I'm attempting. Say we have this sprite sheet for...

EaselJS keyboard input issue

javascript,variables,scope,easeljs
I'm having a problem with easelJS, I have a function that listens for keyboard input but it does not update the variables according to the keys i hit. I placed a console.log inside the different cases and it logs fine but for some reason it does update variables. I think...

TweenJS tweening the frames of a Sprite

javascript,html5,sprite,easeljs,tween
I have a sprite that I want to animate using TweenJS. My first thought was to write something like this: createjs.Tween.get(mySprite).to({currentFrame:30}, 1000); Which didn't work. And simply writing... mySprite.currentFrame = 10; mySprite.currentAnimationFrame = 10; ...does not cause the sprite to update either. So I'm guessing these properties are get only?...

Createjs create timer clock for game

javascript,html5,cordova,easeljs,createjs
Does anyone know the best way to create a timer clock in Createjs please? I know I could do something in html and reference it with the DOMElement, but I have had a bit of a nightmare getting that to work in the past? Basically I need to show a...

Delaying preloadjs for fixed time for testing

javascript,easeljs,createjs,preloadjs
Is there a way in preloadjs to delay the loading of resources by say 2 seconds just for testing purpose to see the animation in action. As in localhost the files are loaded very quickly. Thanks in advance....

Inherit two classes - Javascript

javascript,inheritance,multiple-inheritance,easeljs,createjs
I'm creating a new class definition Button that extends an existing Container class in EaselJS. There are no problems with that. However, I'd also like Button to inherit from a super class All, so that Button also has access to its .banana and .eatBanana. How do I go about this?...

Create EaselJS sprite animation with SpriteStage (WebGL)

javascript,animation,webgl,sprite,easeljs
I have this sprite animation in EaselJS created with the classic Stage, here is the fiddle: Fiddle: http://jsfiddle.net/6sygocvb/ EaselJS now has SpriteStage, which translates to WebGL and falls back to canvas if needed. How do I create the example above with SpriteStage? Can you guys help me with a fiddle?...

Create a Sprite from raw RGBa data

html5,html5-canvas,easeljs,createjs,sprite-sheet
I take several snapshots from playing video on canvas and thus getting raw RGB images into memory. In the documentations its states that Sprite class accepts a Spritesheet instance only. Is there any way to create a Sprite from raw RGBa? Or maybe convert that raw data into separate Bitmap...

CreateJS - d.mousedown.f error on hitAreas

javascript,easeljs,createjs
While programming in CreateJS I have encountered a bug: Unhandled exception at line 13, column 10113 in https://code.createjs.com/createjs-2014.12.12.min.js 0x800a138f - Runtime Error JavaScript code: Can not retrieve "matrix" properties for undefined or empty appeal This bug appears only when I add a hit area into an image: function drawButton(e) {...

How to get a random color in my CreateJS shape?

javascript,random,easeljs,createjs
I want to have a random color where "Crimson" is defined var stage = new createjs.Stage("demoCanvas"); var circle = new createjs.Shape(); circle.graphics.beginFill("Crimson").drawCircle(0, 0, 50); circle.x = 100; circle.y = 100; stage.addChild(circle); stage.update(); ...

Generate Macular Grid in Javascript

javascript,automatic-ref-counting,circle,easeljs
How to generate macular grid in Javascript? In Macular grid contains a no.of circles that should in 'V' shape format. Creation of dotted circles in 'V' shape? let us know how to resolve this? To Identify the Macular grid shape, please refer the below link i have added a screenshot....

Create a Sprite from image array

sprite,easeljs,todataurl
An Image array created from series of calls to toDataUrl() metod of the canvas. Now I need to create a SpriteSheet out of it. How do I do that? var imgUrl = canvas.toDataURL(); var image = new Image(); image.src = imgUrl; arr.push(image); I've read EaselJS docs on SpriteSheet here. But...

Easeljs snap to grid

javascript,canvas,drag-and-drop,easeljs,createjs
I am building an app using HTML5 in which a grid is drawn. I have some shapes on it that you can move. What I'm trying to do is to snap objects to some points defined when you hover them while moving a shape. What I tried is to save...

CreateJS - Measuring FPS in RAF (requestAnimationFrame) mode

easeljs,createjs
I am using CreateJS in the RAF mode createjs.Ticker.timingMode = createjs.Ticker.RAF; How do I integrate with for instance stats.js measure the browser's FPS? Or is there any different, recommended way to measure the FPS with CreateJS? Thanks!...

How to get real FPS with createjs

android,mobile,easeljs,createjs
I created a game with createjs, but it runs very slowly on a mobile. I added a function to show FPS obtained with createjs.Ticker.getMeasuredFPS(). However, the FPS shown by the function is quite normal. I set the FPS to 60, and the result of getMeasuredFPS() is about 55-60, while the...

createjs struggling with hitTest()

javascript,easeljs,createjs
I am populating the canvas with small circles to form a shape and would like to destroy some of the circles where ever user clicks on the screen using the following function. dotsArray : is the array of all circles dot.ball: is the circle being drawn bomb: is the circle...

Adding Children to Container() EaselJS

javascript,containers,easeljs,uncaught-typeerror
I am going through some tutorials and experimenting with javascript and more particularly EaselJS. I want to create a number of containers which hold images and a text together. But I get the following error: "Uncaught TypeError: undefined is not a function" when I try to add the text and...

Angular and CreateJS not finding the stage element

javascript,angularjs,easeljs,createjs
I have an Angular view that is inherited from an ng-view element. In the view file, I have a canvas. The code is controlled by a controller. What I want to do is call up a stage to add elements on the canvas. However when I run the createJS.Stage function,...

removeChild() not working using easeljs

javascript,easeljs,createjs
I am using easeljs to create a stage and then i am putting tiles on the stage on random locations. When the user clicks on a tile, the tile must be removed from the stage. There are two problems that i am facing. First was that the mouse event was...

EaselJS cache Text object

caching,rendering,easeljs,createjs
I would like some help regarding caching Text objects using EaselJS library. I never fully understood how caching works, and i must be missing something really fundamental, because i cannot seem to make it work. Take the following simle example. this.label.cache(this.label.x, this.label.y, rec.width, rec.height); https://jsfiddle.net/xnqcjsg8/ If you comment the line...

Showing uncaught type error in CreateJS. Not showing any output..my code is given below

javascript,easeljs,createjs
its showing some error in createjs file. <html> <head> <title></title> <script src="https://code.createjs.com/createjs-2014.12.12.min.js"> </script> <script> var preload,cW,cH,winW,winH; var road,city1,city2,sky,build1,build2; window.onload = function(){ var canvas = document.getElementById("demoCanvas"); var stage = new createjs.Stage(canvas); cW=1200; cH=600; preload = new createjs.LoadQueue(true); var manifest =[{id:"ad_road",src:"road.png"}, {id:"ad_build1",src:"build.png"},...