所以我在这里遇到了一些问题。
基本上我正在尝试拍摄我的图像,并创建一个比原始图像大x倍的新图像。
我这样做是通过复制r,g,b&每个像素中的一个,并将信息放入一张新图片中,然后在新画布上打印。
我没有收到任何错误,但它也没有出现在我的画布上?
知道我本可以做错什么吗?
我的代码:
使用工作代码更新
这将拍摄图像,然后将其放大反锯齿。它没有保持透明度,但可以轻松调整:
<script>
var c = document.getElementById("annie");
var ctx = c.getContext("2d");
scr_opt = new Array();
scr_opt[0] = 16; //zoom factor
var zoom_img = new Image();
zoom_img.src = 'myownsprites.png';
zoom_img.onload = function() {
var spr_w = 36;
var spr_h = 75;
var pwdth = spr_w * scr_opt[0];
var phght = spr_h * scr_opt[0];
ctx.drawImage(zoom_img, 0, 0, zoom_img.width, zoom_img.height);
var src_data = ctx.getImageData(0, 0, spr_w, spr_h);
var imgData = ctx.createImageData(pwdth, phght);
for (var i = 0; i < src_data.data.length; i += 4) {
var r = src_data.data[i];
var g = src_data.data[i+1];
var b = src_data.data[i+2];
var a = src_data.data[i+3];
var p = i * scr_opt[0] + ((pwdth * 4) * ((scr_opt[0] - 1) * (i - (i % (spr_w * 4)))/(spr_w * 4)));
for (var i_height = 0; i_height < scr_opt[0]; i_height++) {
for (var i_width = 0; i_width < scr_opt[0]; i_width++) {
i_star = p + (i_width * 4);
i_star = i_star + pwdth * 4 * i_height;
imgData.data[i_star+0] = r;
imgData.data[i_star+1] = g;
imgData.data[i_star+2] = b;
imgData.data[i_star+3] = a;
}
}
}
ctx.putImageData(imgData, 110, 10);
ctx.putImageData(src_data, 10, 10);
alert(zoom_img.data[4])
}
</script>