应用放大画布中心的缩放

Question

我需要通过使用以下代码行将缩放应用到我已经完成的javascript画布：

ctx.scale(2,2) //doubles everything's size

它不是缩放，而是显着地增加了画布及其所有元素的大小。如果我按照下图所示的方式工作，我会对此感到满意：

关于如何完成上图所示内容的任何想法？我没有使用任何外部库，因此这很难。感谢。

Answer 1

您可以使用ctx.translate()

将上下文翻译为画布大小的一半

编辑：

var zoomfactor = 2; //set whatever you want as zoom factor
ctx.setTransform
  (zoomfactor, 0, 0, zoomfactor, -(zoomfactor - 1) * canv‌​as.width/2,
 -(zoomfac‌​tor - 1) * canvas.height‌​/2);