在画布中间绘制图像

Question

我正在制作照相馆，但所有图像都绘制在原点（0,0）上。

canvasContent.drawImage(arrPhoto[currentIndex], 0, 0); 

我怎样才能确保我的图像绘制在画布对象的中间？

感谢您的帮助！

UPDATE

我可能已经形成了我的问题有点不对劲。 我的意思是：我希望我的图像中间位于画布中间，而不是图像的顶角。

对不起为

编辑：错字

EDIT2：错字

Answer 1

如果提供了x, y位置，像这样：

var image = arrPhoto[currentIndex]; 
canvasContent.drawImage(image, 
     canvas.width/2 - image.width/2, 
     canvas.height/2 - image.height/2 
); 

那么它应该出现在中心。这个实例的一个例子是：http://jsfiddle.net/VPLZc/2/。

Answer 2

偏移原点（这始终是0,0 - 左上）由+ (image.width/2)和+ (image.height/2)开始在中心抽选的画布。

drawImage(image, image.width/2, image.height/2) 

Answer 3

如果你想把它画到中心，你需要知道图像的宽度和高度。它成为继易：

//var canvas = document.getElementById("yourCanvasElementID"); 
var img = arrPhoto[currentIndex]; 
canvasContent.drawImage(img, (canvas.width-img.width)/2, (canvas.height-img.height)/2);