JavaScript将文本转换为像素坐标

简而言之，给定一个字体（大小、权重等）和一个字符串，有没有办法使用JavaScript提取相对于第一个字母左上角的像素坐标数组

例如，

I

可能成为

[
[0,0],
[0,1],
...
]

---

编辑：我不是在寻找边界框，而是在寻找构成文本的每个像素的坐标。我需要这些信息，以便以后使用正方形重新创建文本。

是的，您可以使用canvas元素获得：

metrics对象将为您提供宽度和高度等。但是-目前大多数浏览器只支持宽度。存在一个，它将涵盖您需要的上升和下降之类的内容

另一种方法是扫描位图以检测文本所覆盖的矩形。我在这里给出了一个答案，涵盖了这项技术：

此外，如果只需要文本的边界框（而不是文本本身的像素精确起点），则可以使用DOM元素获取该框的宽度和高度。以下是一种方法：

澄清后更新：用于从位图中提取像素并将其转换为点：

---

如果是一个字符串，您可以使用split函数并将字符串转换为数组，或者如果您使用的是一个对象，您可以使用该对象的索引来访问该值。也许我应该稍微澄清一下我的问题。我不是在寻找边界框，而是在寻找组成文本的每个像素的坐标。我需要这些信息，以便在以后使用正方形重新创建文本。@KevinPei那么您可能正在寻找这样的信息：？正是我想要的！谢谢！：）@科文佩：没问题！：）

// setup canvas
var c = document.createElement("canvas"),
    ctx = c.getContext("2d");

// define (pre-loaded) font:
ctx.font = "bold 16px sans-serif";

// get metrics
var m = ctx.measureText("Hello");