我正在将图像写入画布,然后缩放上下文并将其重新写入同一画布。一旦它被写回画布,我无法弄清楚如何获得缩放区域的确切大小。我需要以像素为单位的大小,这样我就可以计算平移偏移量,无论比例如何都能使它在画布上居中。
画布/上下文看起来像这样。
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
我正在应用这样的比例(按比例扩大.1)。
scale = scale * '1.1';
img_w = img.width * scale;
img_y = img.height * scale;
ctx.scale('1.1', '1.1');
然后,我正在使用
ctx.drawImage(img, (canvas.width - img_w) / 2, (canvas.height - img_h) / 2);
重绘图像,这是它失败的地方,因为我没有缩放区域的确切宽度。
这是一个小提琴http://jsfiddle.net/robertsdavidb/bGyFT/13/
缩放工作正常,但如何缩放后将其保留在中心?