我知道我可以使用context.measureText擷取某些文本的寬度(如果現在可以在畫布上呈現該文本)。
有沒有辦法做到這一點，但要獲得文本的高度？
隻是對我自己的一個想法-也許我可以将文本旋轉90Deg，然後測試寬度？...
在這裡尋找一個好的答案：stackoverflow.com/questions/1134586/
我在這裡釋出了具有簡單功能的解決方案-stackoverflow.com/a/36729322/1828637
如何找到HTML畫布上文本高度的可能重複項？
我有同樣的問題，發現的是這個。
從字元串中擷取字型大小。
我不知道為什麼，但是它僅在您在PT(而非PX)中設定屬性時才有效。
ctx.font="20px Georgia"; // This will not work.
ctx.font="20pt Georgia"; // This is what we need.
然後從中擷取價值。
var txtHeight = parseInt(ctx.font);
現在您擁有了發短信的高度。
就像我說的那樣，我必須将PT中的尺寸設定為PX
如果設定字型粗細或(另一個樣式參數)，它将傳回例如bold 40px verdana，是以parseInt将失敗...
fontheight = parseInt(ctx.font.match(/ d + /)，10);
這樣的答案可能是針對您的需求過度設計的
如何找到HTML畫布上文本的高度？
我更喜歡一些簡單的東西：
var text ="Hello World";
var font ="Serif";
var size ="16";
var bold = false;
var div = document.createElement("div");
div.innerHTML = text;
div.style.position = 'absolute';
div.style.top = '-9999px';
div.style.left = '-9999px';
div.style.fontFamily = font;
div.style.fontWeight = bold ? 'bold' : 'normal';
div.style.fontSize = size + 'pt'; // or 'px'
document.body.appendChild(div);
var size = [ div.offsetWidth, div.offsetHeight ];
document.body.removeChild(div);
// Output
console.log( size );
var pre = document.getElementById("output" );
if( pre )
pre.innerHTML = size;
[cc ]
code> pre>
參考：
http://www.rgraph.net/blog/2013/january/measuring-text-height-with-html5-canvas.html
畫布在哪裡？
您不需要度量标準的畫布。
您可以設定畫布的字型大小(以像素為機關)，然後可以将其用作文本框的高度。但是，當我這樣做時，我發現需要将像素高度增加大約50％才能獲得準确的值：
var textHeight = fontSize * 1.5;
如果這對您還不夠好，那麼這裡概述了一些非常完善的解決方案，其中一種使用getImageData方法來計算垂直像素的數量。
這取決于字型類型，并且假定沒有非常有趣的字元。