HTML5画布字体大小

Question

当我翻译和缩放画布时，放在画布上的文本对应于画布比例。无论画布的大小如何，我怎样才能使它成为固定大小？

假设我有一个使用缩放的画布，即使尺寸是640x480像素，缩放比例也是8x5画布单位。如果我现在使用context.fillText，文字会很大。我需要文字始终是相同的视觉大小，比如12px。

Answer 1

在绘制文本之前，您必须暂时重置比例（也称为将变换矩阵设置回身份）。

// I have lots of transforms right now 
ctx.save(); 
ctx.setTransform(1, 0, 0, 1, 0, 0); 
// Will always draw text in normal scale 
ctx.fillText("lalalala", x, y); 
ctx.restore(); 
// Still have my old transforms