wulin.com（www.vevb.com）記事はじめに：HTML5キャンバステキストのテキスト測定を取得するには、測定text（）canvasコンテキストの方法を使用できます。この方法にはテキスト文字列が必要であり、測定オブジェクトに基づいて提供されたテキストのフォントを返し、コンテキストの現在のテキストに割り当てられます。
HTML5 Canvasのテキストメトリックを取得するには、測定テキスト（）のキャンバスコンテキストのメソッドを使用できます。この方法にはテキスト文字列が必要であり、測定オブジェクトに基づいて提供されたテキストのフォントを返し、コンテキストの現在のテキストに割り当てられます。
現在、テキストの幅は、MeasureText（）メソッドを使用して唯一の測定値です。テキストの高メートルシステムは現在サポートされていません。
<！doctype html>
<html>
<head>
<style>
体 {
マージン：0px;
パディング：50px;
}
#mycanvas {
国境：1pxソリッド＃9C9898;
}
</style>
<スクリプト>
window.onload = function（）{
var canvas = document.getElementbyid（mycanvas）;
var context = canvas.getContext（2d）;
var x = canvas.width / 2;
var y = canvas.height / 2-10;
var text = hello world !!;
context.font = 30pt calibri;
context.textalign = center;
context.fillstyle = blue;
context.filltext（text、x、y）;
//テキストメトリックを取得します
var metrics = context.measureText（テキスト）;
var width = metrics.width;
context.font = 20pt calibri;
context.textalign = center;
context.fillstyle =＃555;
context.filltext（（ + width + px幅）、x、y + 40）;
};
</script>
</head>
<body onmousedown = return false;>
<キャンバスID = mycanvas width = 578 heigh = 200>
</canvas>
</body>
</html>