کتابخانهٔ رایگان جاوااسکریپت برای تجزیه و نوشتن فونتها
کتابخانهٔ منبع باز جاوااسکریپت که امکان تجزیه، خواندن و نوشتن فونتهای TrueType یا OpenType را فراهم میکند. از مدیریت فونت، معیارهای گلیف و چیدمان متن در برنامههای جاوااسکریپت پشتیبانی میکند.
در حوزه توسعه وب نرمافزار و تایپوگرافی دیجیتال، مدیریت فایلهای فونت و ایجاد تجربههای رندر متن بدون درز میتواند کاری دشوار باشد. با این حال، کار با فونتهای OpenType میتواند چالشبرانگیز باشد، بهویژه زمانی که به دسترسی به ویژگیهای پیشرفته تایپوگرافی آنها نیاز داریم. اینجا است که OpenType.js وارد میشود – یک کتابخانه منبع باز انقلابی که کار با فونتهای OpenType در مرورگر را آسان میکند. یکی از مزایای کلیدی OpenType.js توانایی سادهسازی فرآیند کار با فونتهای OpenType است. برخلاف کتابخانههای دیگر که نیاز به دانش گستردهای از فناوری فونت دارند، OpenType.js یک API ساده ارائه میدهد که شروع کار را آسان میکند.
OpenType.js یک کتابخانهٔ جاوااسکریپت است که یک API ساده و شهودی برای دسترسی به ویژگیهای پیشرفتهٔ تایپوگرافی فونتهای OpenType فراهم میکند. با OpenType.js، توسعهدهندگان نرمافزار میتوانند به راحتی به ویژگیهایی مانند لیگچرها، گلیفهای جایگزین، فونتهای متغیر و غیره دسترسی پیدا کنند و این امکان را دارند که طرحهای تایپوگرافی پیچیده و پیشرفتهای ایجاد کنند. علاوه بر تجزیه و تحلیل و دستکاری فونتهای موجود، opentype.js همچنین از ایجاد فایلهای فونت جدید از صفر پشتیبانی میکند. این ویژگی برای توسعهدهندگانی که میخواهند فونتهای سفارشی را بهصورت برنامهنویسی تولید کنند، ارزشمند است. بهعنوان یک کتابخانهٔ جاوااسکریپت، opentype.js میتواند در محیطهای سمتکلاینت و سمتسرور استفاده شود، که آن را به گزینهای انعطافپذیر برای پروژههای مختلف تبدیل میکند. به طور کلی، این کتابخانهٔ قدرتمند و چندمنظوره راهی ساده و شهودی برای کار با فونتهای OpenType در مرورگر ارائه میدهد.
شروع کار با Opentype.js
روش پیشنهادی برای نصب OpenType.js استفاده از NPM است. لطفاً برای نصب بدون مشکل از دستور زیر استفاده کنید.
نصب Opentype.js با استفاده از npm
npm install opentype.jsهمچنین میتوانید آن را بهصورت دستی نصب کنید؛ فایلهای آخرین نسخه را مستقیماً از مخزن GitHub دانلود کنید.
تجزیه فونت در برنامههای Node.js
یکی از ویژگیهای اصلی OpenType.js توانایی آن در تجزیه فایلهای قلم OpenType و TrueType با تنها چند خط کد جاوااسکریپت است. این امکان به توسعهدهندگان نرمافزار اجازه میدهد ساختار یک قلم، از جمله گلیفها، اطلاعات کرنینگ و سایر دادههای اساسی را بخوانند و درک کنند. در مثال زیر، قلم Roboto Regular از یک فایل TTF بارگذاری میشود. کتابخانه قلم را تجزیه میکند و دادههای آن را برای دستکاریهای بعدی در دسترس میگذارد.
چگونه یک فونت را از فایل TTF داخل Node.js بارگذاری و تجزیه کنیم؟
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);
}
});