Clever Geek Handbook

How to change width and height of bitmap in easeljs?

I am using easeljs to create an HTML5 page. I need to load images to canvas. How do I change the width and height of the bitmap I am loading.

var img = new Image();  
img.src = image_path+images; // image from folder        
var loading_img = new createjs.Bitmap(img);  
stage.addChild(loading_img);

It just displays the image in the canvas, I am trying to use

loading_img.sourceRect = { x:img.width/2, y:img.height/2, width:280, height:150 };

but crops the image (280 * 150).

Thanks, Sathya

+4


source to share


5 answers


Instead of adjusting the width and height, you should adjust scaleX and scaleY. To double the size of an image, you must do the following:



loading_img.scaleX=2.0;
loading_img.scaleY=2.0;
+8


source


You must first load the image (so you know its height and width) and then create a bitmap and set the scale.



var image = new Image();
image.onload = function(){
    var bitmap = new createjs.Bitmap(image);
    bitmap.scaleX = YOUR_WIDTH/image.width;
    bitmap.scaleY = YOUR_HEIGHT/image.height;
    this.stage.addChild(bitmap);
};
image.src = 'thePathToYourImage.png';
+2


source


It's good for me.

img[h] = new Image();
img[h].src = //image path
r_mc[h] = new createjs.Bitmap(img[h]);
r_mc[h].y = 15;
r_mc[h].x = 10
r_mc[h].scaleX=280/r_mc[h].image.width;  //200
r_mc[h].scaleY=140/r_mc[h].image.height; //100
stage.addChild(r_mc[h]);

if r_mc [h] .image.width and r_mc [h] .image.height didn't affect your image size, try to get the image dimensions before and set this way

r_mc[h].scaleX=280/200;
r_mc[h].scaleY=140/100;

Thanks,
Sathya

+1


source


Yes, the scaleX / Y functions work pretty well for resizing images.

Ol Ata p>

0


source


I usually do it like this:

var bitmap = new createjs.Bitmap(image object);
bitmap.scaleX = (your width number value) / bitmap.image.width;    
bitmap.scaleY = (your height number value) / bitmap.image.height;
stage.addChild(bitmap);
0


source






More articles:


All Articles