例項屬性
FontData.family只讀 實驗性-
返回字型家族。
FontData.fullName只讀 實驗性-
返回字型的完整名稱。
FontData.postscriptName只讀 實驗性-
返回字型的 PostScript 名稱。
FontData.style只讀 實驗性-
返回字型樣式。
例項方法
FontData.blob()實驗性-
返回一個
Promise,該 Promise fulfilled 時會得到一個Blob物件,其中包含底層字型檔案的原始位元組。
示例
有關即時示例,請參閱我們的 Local Font Access API 演示。
字型列舉
以下程式碼段將查詢所有可用的字型,並記錄元資料。例如,這可以用於填充字型選擇控制元件。
js
async function logFontData() {
try {
const availableFonts = await window.queryLocalFonts();
for (const fontData of availableFonts) {
console.log(fontData.postscriptName);
console.log(fontData.fullName);
console.log(fontData.family);
console.log(fontData.style);
}
} catch (err) {
console.error(err.name, err.message);
}
}
訪問低階資料
blob() 方法提供對低階 SFNT 資料的訪問——這是一種字型檔案格式,可以包含其他字型格式,例如 PostScript、TrueType、OpenType 或 Web Open Font Format (WOFF)。
js
async function computeOutlineFormat() {
try {
const availableFonts = await window.queryLocalFonts({
postscriptNames: ["ComicSansMS"],
});
for (const fontData of availableFonts) {
// `blob()` returns a Blob containing valid and complete
// SFNT-wrapped font data.
const sfnt = await fontData.blob();
// Slice out only the bytes we need: the first 4 bytes are the SFNT
// version info.
// Spec: https://learn.microsoft.com/en-us/typography/opentype/spec/otff#organization-of-an-opentype-font
const sfntVersion = await sfnt.slice(0, 4).text();
let outlineFormat = "UNKNOWN";
switch (sfntVersion) {
case "\x00\x01\x00\x00":
case "true":
case "typ1":
outlineFormat = "truetype";
break;
case "OTTO":
outlineFormat = "cff";
break;
}
console.log("Outline format:", outlineFormat);
}
} catch (err) {
console.error(err.name, err.message);
}
}
規範
| 規範 |
|---|
| 本地字型訪問 API # fontdata-interface |
瀏覽器相容性
載入中…