javascript - HTML5 Canvas : Draw rectangle around text?

标签 javascript html canvas

我希望能够在文本标签(人的全名)周围绘制一个合适的矩形。边距不是特别重要,但我不能只绘制固定大小的矩形,因为标签的长度各不相同。我该怎么做?

这是绘制文本标签的代码:

var ctx = document.getElementById('map').getContext('2d');
for (i=0; i < num_people; i++) {
    var pos = get_position(i, num_people);
    ctx.fillText(names[i], pos.x, pos.y);
}

最佳答案

您可以使用measureText() 获取绘制文本的大小.

关于javascript - HTML5 Canvas : Draw rectangle around text?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4065273/

相关文章:

java - 显示非常左上角的位图图像,未缩放

javascript - WebGL 多个着色器

javascript - 如何同时使用 Fullpage.js 和 Scroll.is

java - 当文件名是泰语时,使用 enctype ="multipart/form-data"上传文件时出现奇怪的文件名

javascript - 选择与目标位于同一父级中的元素

image - 实时替换图像上的颜色

javascript - 永远不会调用异步函数的回调

javascript - 使用 AJAX 的 JQuery 自动完成

Jquery dd 选择

reactjs - 如何将 PaperJs 与 React 结合使用?