我有一个大图像，但我需要使用相同的图像只有一半的大小，并保持图像质量

Question

我在使用图像进行视网膜显示时遇到了麻烦。我使用drawImage。我有一组大图像（画布画），我想使用它们，但只有一半的尺寸，使它们更小，提高了图像质量。

如何做到这一点？这是一个屏幕外的画布。

Answer 1

您可以通过将CSS大小设置为小于画布元素大小来对图像进行过采样（提高其分辨率）：

更大的html画布元素：

<canvas id="canvas" width=600 height=300></canvas>

较小的CSS样式（导致2倍过采样）：

#canvas{ width:300px; height:150px; }