Open antag0n1st opened 10 years ago
Theoretically it's possible to set the resolution via
var canvas = document.createElement("canvas");
canvas.width = 1280;
canvas.height = 720;
But I think there is some bug with that (try it for yourself) - so the resolution is currently set to 720. Any scaling is done in your script, you can scale the images as you would with a normal canvas image:
var context = canvas.getContext("2d");
var image = new Image();
var scaleX = 100;
var scaleY = 200;
image.onload = function () {
setInterval(function () {
context.drawImage(image, 400, 300, scaleX, scaleY);
}, 1000/60);
};
image.src = "media/starship.png";
(taken from OwnGap/assets/test.js - there is an example in there on how to start)
I figure out the scaling of an image.
this method:
context.drawImage(img,x,y,width,height);
is not properly implemented , instead of stretching the image to the specified width and height , it crops the image.
but , the other implementation of the same method is good.
context.drawImage(img,sx,sy,swidth,sheight,x,y,width,height);
using that one , solves the problem.
and just to confirm that the scaling of the canvas works fine:
var canvas = document.createElement("canvas"); canvas.width = 1280; canvas.height = 720;
how to scale the canvas ? how to scale sprites ?