Shrinking image with the scale: distorts image

[luisdemarchi]

Using createjs: Putting a scale to "shrink" the image is leaving it unconfigured.

Look: http://img534.imageshack.us/img534/8790/f9i0.png

--

I am creating my first educational game with HTML5.

I made all the images to a screen of 2024x1200. So I created a canvas "full screen" and do the famous rule of three to discover the new image scale.

Width

• Screen Original: 2024 pixels
  
• Image Original: 1000 pixels
  
• Screen Actual: 548 pixels
  
• Image View:? pixels
  

new width = 548 * 1000/2024; Image scale = new width / original image;

Result: http://img534.imageshack.us/img534/8790/f9i0.png

APP.mapMain = new createjs.Bitmap(mapMainBitmapTemp);

APP.stage.addChild(APP.mapMain);


APP.mapMain.x=0;

APP.mapMain.y=10;

APP.mapMain.scaleY= 0.27734375;

APP.mapMain.scaleX= 0.27734375;

[rich]

At a guess I reckon this is the result of your massive textures getting crushed by iOS, they look like mipmapping artefacts to me. Put it to the test - resize some of your graphics so they are the actual needed size (548px) and have a look. If they look fine then I suspect it's texture related.

[luisdemarchi]

At a guess I reckon this is the result of your massive textures getting crushed by iOS, they look like mipmapping artefacts to me. Put it to the test - resize some of your graphics so they are the actual needed size (548px) and have a look. If they look fine then I suspect it's texture related.

 

The problem in this scale. I left the original image width 548pixeis.

 

1) I applied the scale to decrease more: spoiled.

2) I kept unscaled (original) and was perfect.

 

What do I do? I'll have to load various image sizes?