Canvas中的Text文本也是一個知識點~，我們需要掌握一下幾個基本的Text操作方法
首先是重要參數textAlign和textBaseline：
textAlign
- left
- center
- right
- start (default)
- end
textBaseline
- alphabetic (default)【適合Latin文字類，“abc”】
- hanging【適合一些印地語，“अस्सी”】
- ideographic【適合中文之類的，“哈哈哈”】
- top
- middle
- bottom
前三個是根據字體來說的比較合適的選擇，而后面三個就是給予em square而定的。
em square 就是方格字的意思，每個字體，比如微軟雅黑，都有自己的方格大小，top就是方格的頭部，bottom就是方格的底部，但是不可能每個字都撐滿一個方格的，所以top，bottom總是會留一些空白的。
給大家一個直觀的感受 點擊
接着是寫字的方法fillText和strokeText
實心字體
context.fillText(“你的字符穿”, X軸坐標, Y軸坐標， MaxWidth)//超過MaxWidth，文字就會被壓縮
鏤空字體
context.strokeText(“你的字符穿”, X軸坐標, Y軸坐標， MaxWidth)//超過MaxWidth，文字就會被壓縮，就感覺字被壓扁的感覺，哈哈哈哈
//如何優雅地在canvas上寫字
context.font="18px 微軟雅黑"//和css中的font一樣，不過沒有了行高
context.textAlign=“center”//和css中的text-align一樣
context.textBaseline=“top”//這個是文本基線的意思
context.fillStyle = 'red';//你的字體顏色
context.fillText(“你的字符串”, X軸坐標, Y軸坐標， MaxWidth)//超過MaxWidth，文字就會被壓縮
//通過以上面設置的字體參數，可以用以下方法得出字體的長度
context.measureText("你需要測量長度的字符串")
//那么大家要有疑問了，字體的高度呢？高度該怎么算呢？
//我認為和字體的大小一樣就可以了，就是字體18px，那么高度也差不多18px。
延伸閱讀：
關於em square的——EM Square