Perpustakaan JavaScript Gratis untuk Penguraian & Penulisan Font
Perpustakaan JavaScript Sumber Terbuka yang memungkinkan Mengurai, Membaca, dan menulis font TrueType atau OpenType. Ini mendukung Penanganan Font, Metri Glyph, dan Tata Letak Teks dalam aplikasi JS.
Di bidang pengembangan perangkat lunak web dan tipografi digital, menangani file font dan menciptakan pengalaman rendering teks yang mulus dapat menjadi tugas yang menantang. Namun, bekerja dengan font OpenType dapat menjadi tugas yang menantang, terutama ketika harus mengakses fitur tipografi lanjutan mereka. Di sinilah OpenType.js berperan – sebuah perpustakaan sumber terbuka yang revolusioner yang memudahkan kerja dengan font OpenType di browser. Salah satu manfaat utama OpenType.js adalah kemampuannya menyederhanakan proses kerja dengan font OpenType. Tidak seperti perpustakaan lain yang memerlukan pengetahuan mendalam tentang teknologi font, OpenType.js menyediakan API yang sederhana sehingga mudah untuk memulai.
OpenType.js adalah perpustakaan JavaScript yang menyediakan API yang sederhana dan intuitif untuk mengakses fitur tipografi lanjutan dari font OpenType. Dengan OpenType.js, pengembang perangkat lunak dapat dengan mudah mengakses fitur seperti ligatur, glif alternatif, font variabel, dan sebagainya, memungkinkan mereka membuat desain tipografi yang kompleks dan canggih. Selain mem-parsing dan memanipulasi font yang ada, opentype.js juga mendukung pembuatan file font baru dari awal. Fitur ini berharga bagi pengembang yang ingin menghasilkan font khusus secara programatis. Karena merupakan perpustakaan JavaScript, opentype.js dapat digunakan baik di lingkungan sisi klien maupun sisi server, menjadikannya pilihan fleksibel untuk berbagai proyek. Secara keseluruhan, ini adalah perpustakaan yang kuat dan serbaguna yang menyediakan cara yang sederhana dan intuitif untuk bekerja dengan font OpenType di peramban.
Memulai dengan Opentype.js
Cara yang disarankan untuk menginstal OpenType.js adalah menggunakan NPM. Silakan gunakan perintah berikut untuk instalasi yang lancar.
Instal Opentype.js menggunakan npm
npm install opentype.jsAnda juga dapat menginstalnya secara manual; unduh file rilis terbaru langsung dari GitHub repository.
Penguraian Font dalam Aplikasi Node.js
Salah satu fitur inti OpenType.js adalah kemampuannya untuk mengurai file font OpenType dan TrueType hanya dengan beberapa baris kode JavaScript. Ini memungkinkan pengembang perangkat lunak membaca dan memahami struktur sebuah font, termasuk glif, informasi kerning, dan data penting lainnya. Pada contoh berikut, font Roboto Regular dimuat dari file TTF. Perpustakaan mengurai font tersebut, menjadikan datanya tersedia untuk manipulasi lebih lanjut.
Cara Memuat dan Menguraikan Font dari File TTF di dalam 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);
}
});
Akses & Manipulasi Glif Font dalam Node.js
Perpustakaan Node.js sumber terbuka OpenType.js memungkinkan pengembang perangkat lunak mengakses dan memanipulasi glif individual dalam sebuah font di dalam aplikasi Node.js. Glif adalah representasi visual dari karakter dalam sebuah font. Dengan fitur ini, Anda dapat mengekstrak jalur glif, memodifikasinya, atau bahkan membuat glif baru. Berikut adalah cuplikan kode yang memuat sebuah font, mengambil glif untuk karakter "A," dan kemudian memperbesar glif tersebut sebesar 1,5 kali ukuran aslinya. Metode toPathData() mengubah jalur glif menjadi data jalur SVG, yang dapat digunakan untuk rendering atau manipulasi lebih lanjut.
Cara Memuat Font dan Memodifikasi Glif dalam Aplikasi 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());
}
});
Bekerja dengan Tabel Font melalui Pustaka Node.js
OpenType.js memberi pengembang akses ke tabel font yang mendasari, yang menyimpan informasi terperinci tentang desain dan metrik font. Ini dapat sangat berguna untuk manipulasi atau analisis font tingkat lanjut. Potongan kode dalam contoh berikut menunjukkan cara mengakses tabel font tertentu, seperti tabel head (yang berisi informasi header font) dan tabel hhea (yang menyimpan metrik header horizontal). Tabel-tabel ini menyediakan detail penting yang dapat digunakan untuk kontrol yang tepat atas rendering dan tata letak font.
Cara Mengakses Tabel Font Spesifik dan Font di Dalamnya menggunakan Perpustakaan 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);
}
});