1. 产品
  2.   Font
  3.   Node.js
  4.   OpenType.js
 
  

免费 JavaScript 字体解析与写入库

开源 JavaScript 库，可解析、读取和写入 TrueType 或 OpenType 字体。它支持在 JS 应用中进行字体处理、字形度量和文本布局。

在软件网页开发和数字排版领域，处理字体文件并创建无缝的文本渲染体验可能是一项艰巨的任务。然而，使用 OpenType 字体尤其在访问其高级排版特性时更为困难。这正是 OpenType.js 的用武之地——一个革命性的开源库，使在浏览器中使用 OpenType 字体变得轻而易举。OpenType.js 的关键优势之一是能够简化使用 OpenType 字体的过程。不同于其他需要深入了解字体技术的库，OpenType.js 提供了直接的 API，让入门变得容易。

OpenType.js 是一个 JavaScript 库，提供了一个简单直观的 API，用于访问 OpenType 字体的高级排版特性。使用 OpenType.js，软件开发者可以轻松访问连字、替代字形、可变字体等功能，从而创建复杂且精致的排版设计。除了解析和操作现有字体外，opentype.js 还支持从头创建新的字体文件。此功能对希望以编程方式生成自定义字体的开发者非常有价值。作为一个 JavaScript 库，opentype.js 可以在客户端和服务器端环境中使用，使其成为各种项目的灵活选择。总体而言，它是一个强大且多功能的库，提供了一种简单直观的方式在浏览器中使用 OpenType 字体。

Previous Next

Opentype.js 入门指南

推荐的 OpenType.js 安装方式是使用 NPM。请使用以下命令进行顺利安装。

使用 npm 安装 Opentype.js

 npm install opentype.js

您也可以手动安装；直接从 GitHub 仓库下载最新发布文件。

Node.js 应用中的字体解析

OpenType.js 的核心功能之一是只需几行 JavaScript 代码即可解析 OpenType 和 TrueType 字体文件。这使得软件开发者能够读取并了解字体的结构，包括字形、字距信息以及其他关键数据。在下面的示例中，Roboto Regular 字体从 TTF 文件加载。库解析该字体，使其数据可用于进一步的操作。

如何在 Node.js 中加载并解析 TTF 文件中的字体？

const opentype = require('opentype.js');

// Load a font from a file
opentype.load('fonts/Roboto-Regular.ttf', function(err, font) {
    if (err) {
        console.error('Font could not be loaded:', err);
    } else {
        console.log('Font loaded successfully:', font);
        console.log('Number of glyphs:', font.numGlyphs);
    }
});

在 Node.js 中访问和操作字体字形

开源的 Node.js 库 OpenType.js 允许软件开发者在 Node.js 应用中访问和操作字体中的单个字形。字形是字体中字符的可视化表示。借助此功能，您可以提取字形路径、修改它们，甚至创建新的字形。下面的代码片段加载一个字体，获取字符 “A” 的字形，然后将该字形按原始大小的 1.5 倍进行缩放。toPathData() 方法将字形的路径转换为 SVG 路径数据，可用于渲染或进一步操作。

如何在 Node.js 应用中加载字体并修改字形？

const opentype = require('opentype.js');

// Load a font and modify a glyph
opentype.load('fonts/Roboto-Regular.ttf', function(err, font) {
    if (err) {
        console.error('Font could not be loaded:', err);
    } else {
        const glyph = font.charToGlyph('A');
        console.log('Original Glyph Path:', glyph.path.toPathData());

        // Modify the glyph path (e.g., scale it)
        glyph.path.scale(1.5);
        console.log('Scaled Glyph Path:', glyph.path.toPathData());
    }
});

通过 Node.js 库处理字体表

OpenType.js 为开发者提供对底层字体表的访问，这些表存储了关于字体设计和度量的详细信息。这对于高级字体操作或分析特别有用。以下示例中的代码片段演示了如何访问特定的字体表，例如包含字体头信息的 head 表和保存水平头部度量的 hhea 表。这些表提供了可用于对字体渲染和布局进行精确控制的关键细节。

如何使用 Node.js 库访问特定字体表及其内部的字体？

const opentype = require('opentype.js');

opentype.load('path/to/font.ttf', function(err, font) {
  if (err) {
    console.error('Font could not be loaded: ' + err);
  } else {
    // Access the 'head' table (font header)
    const headTable = font.tables.head;
    console.log('Units per Em: ' + headTable.unitsPerEm);

    // Access the 'hhea' table (horizontal header)
    const hheaTable = font.tables.hhea;
    console.log('Ascender: ' + hheaTable.ascender);
    console.log('Descender: ' + hheaTable.descender);
  }
});
 中国人