javascript-提取ttf字体连字映射

前端之家收集整理的这篇文章主要介绍了javascript-提取ttf字体连字映射 前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我有一个现有的ttf font,我希望将所有Ligature映射提取为这种形式:

{
    "calendar_today": "E935","calendar_view_day": "E936",...
}

我在此脚本中使用fontkit

const fontkit = require('fontkit');
let font = fontkit.openSync('./MaterialIcons-Regular.ttf');
let lookupList = font.GSUB.lookupList.toArray();
let lookupListIndexes = font.GSUB.featureList[0].feature.lookupListIndexes;

lookupListIndexes.forEach(index => {
    let subTable = lookupList[index].subTables[0];
    let ligatureSets = subTable.ligatureSets.toArray();

    ligatureSets.forEach(ligatureSet => {
        ligatureSet.forEach(ligature => {
            let character = font.stringsForGlyph(ligature.glyph)[0];
            let characterCode = character.charCodeAt(0).toString(16).toUpperCase();

            let ligatureText = ligature
                .components
                .map(x => font.stringsForGlyph(x)[0])
                .join('');

            console.log(`${ligatureText} -> ${characterCode}`);
        });
    });
});

但是,我没有完整的Ligature名称.输出

...
alendar_today -> E935
rop_portrait -> E3C5
ontact_phone -> E0CF
ontrol_point -> E3BA
hevron_right -> E5CC
...

我究竟做错了什么?通过对FontForge的分析判断,字体的Ligature名称不丢失任何字符.

最佳答案
here所示,第一个字符是根据覆盖范围记录计算的.

首先,计算主角

let leadingCharacters = [];
subTable.coverage.rangeRecords.forEach((coverage) => {
    for (let i = coverage.start; i <= coverage.end; i++) {
        let character = font.stringsForGlyph(i)[0];
        leadingCharacters.push(character);
    }
});

然后,通过子表的索引访问这些字符

let ligatureSets = subTable.ligatureSets.toArray();
ligatureSets.forEach((ligatureSet,ligatureSetIndex) => {

    let leadingCharacter = leadingCharacters[ligatureSetIndex];

    ligatureSet.forEach(ligature => {
        let character = font.stringsForGlyph(ligature.glyph)[0];
        let characterCode = character.charCodeAt(0).toString(16).toUpperCase();

        let ligatureText = ligature
            .components
            .map(x => font.stringsForGlyph(x)[0])
            .join('');

        ligatureText = leadingCharacter + ligatureText;

        console.log(`${ligatureText} -> ${characterCode}`);
    });
});
原文链接:https://www.f2er.com/js/531156.html

猜你在找的JavaScript相关文章