HTML画布缩放到特定区域

Question

我有HTML画布代码，可绘制以下图形。有没有一种简单的方法可以缩放红色矩形框出的区域而无需重写代码？该区域始终位于图表的右上角，我还想为轴保留一些空间。

Answer 1

所以，我找到了解决方法：

1. 绘制两倍大的原始画布

2. 检索区域图像并将其放置在新画布上

       var imgData = ctx.getImageData(canvas.width/2 - 20, 0, canvas.width/2 + 20, canvas.width/2 + 20);
       ctx.clearRect(0, 0, canvas.width, canvas.height);
       canvas.width /= 2
       canvas.height /= 2
       canvas.height += 20
       ctx.putImageData(imgData, 0, 0);