缩放文本以填充 HTML5 画布的最佳方法

Question

我需要“缩放”文本以填充 antire HTML5 画布。看来该scale()方法不影响文本。我见过在measureText()方法上带有迭代循环的近似方法，但这并不能完全满足我的需要。理想情况下，我想在不保留纵横比的情况下水平和垂直填充。SVG 可以帮助解决这个问题吗？

Answer 1

我的缺点 - 比例确实适用于文本。我想出了一个解决方案：

context.font = "20px 'Segoe UI'";
var metrics = context.measureText("Testing!");
var textWidth = metrics.width;

var scalex = (canvas.width / textWidth);
var scaley = (canvas.height / 23);

var ypos = (canvas.height / (scaley * 1.25));

context.scale(scalex, scaley);
context.fillText("Testing!", 0, ypos);