1. Produse
  2.   Font
  3.   Node.js
  4.   OpenType.js
 
  

Bibliotecă JavaScript gratuită pentru parsarea și scrierea fonturilor

Bibliotecă JavaScript Open Source care permite parsarea, citirea și scrierea fonturilor TrueType sau OpenType. Suportă gestionarea fonturilor, metricile glifului și aranjarea textului în aplicații JS.

În domeniul dezvoltării web de software și al tipografiei digitale, gestionarea fișierelor de font și crearea unor experiențe de redare a textului fără întreruperi pot fi o sarcină dificilă. Totuși, lucrul cu fonturile OpenType poate fi o sarcină dificilă, în special când vine vorba de accesarea funcțiilor tipografice avansate ale acestora. Aici intervine OpenType.js – o bibliotecă revoluționară open-source care facilitează lucrul cu fonturile OpenType în browser. Unul dintre principalele beneficii ale OpenType.js este capacitatea sa de a simplifica procesul de lucru cu fonturile OpenType. Spre deosebire de alte biblioteci care necesită cunoștințe extinse despre tehnologia fonturilor, OpenType.js oferă un API simplu care face pornirea ușoară.

OpenType.js este o bibliotecă JavaScript care oferă o API simplă și intuitivă pentru accesarea funcțiilor tipografice avansate ale fonturilor OpenType. Cu OpenType.js, dezvoltatorii de software pot accesa cu ușurință funcții precum ligaturi, glife alternative, fonturi variabile și altele, permițându-le să creeze designuri tipografice complexe și sofisticate. Pe lângă parsarea și manipularea fonturilor existente, opentype.js suportă, de asemenea, crearea de noi fișiere de font de la zero. Această funcție este valoroasă pentru dezvoltatorii care doresc să genereze fonturi personalizate programatic. Fiind o bibliotecă JavaScript, opentype.js poate fi utilizată atât în medii client-side, cât și server-side, făcând-o o alegere flexibilă pentru diverse proiecte. În ansamblu, este o bibliotecă puternică și versatilă care oferă o modalitate simplă și intuitivă de a lucra cu fonturile OpenType în browser.

Previous Next

Începerea cu Opentype.js

Modul recomandat de instalare a OpenType.js este prin utilizarea NPM. Vă rugăm să folosiți comanda următoare pentru o instalare fără probleme.

Instalați Opentype.js folosind npm

 npm install opentype.js

De asemenea, îl puteți instala manual; descărcați cele mai recente fișiere de lansare direct de pe depozitul GitHub.

Analiza fonturilor în aplicații Node.js

Una dintre caracteristicile de bază ale OpenType.js este capacitatea sa de a analiza fișierele de font OpenType și TrueType cu doar câteva linii de cod JavaScript. Aceasta permite dezvoltatorilor de software să citească și să înțeleagă structura unui font, inclusiv glifele, informațiile de kerning și alte date esențiale. În exemplul următor, fontul Roboto Regular este încărcat dintr-un fișier TTF. Biblioteca analizează fontul, punând datele sale la dispoziție pentru manipulări ulterioare.

Cum să încărcați și să analizați un font dintr-un fișier TTF în 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);
    }
});

Acces și manipulare a glifelor fontului în Node.js

Biblioteca open source pentru Node.js, OpenType.js, permite dezvoltatorilor de software să acceseze și să manipuleze glife individuale dintr-un font în cadrul aplicațiilor Node.js. Glifele sunt reprezentările vizuale ale caracterelor dintr-un font. Cu această funcționalitate, poți extrage căile glifelor, le poți modifica sau chiar crea glife noi. Iată un fragment de cod care încarcă un font, recuperează glifa pentru caracterul "A" și apoi scalează glifa de 1,5 ori dimensiunea sa originală. Metoda toPathData() convertește calea glifei în date de tip SVG path, care pot fi utilizate pentru redare sau manipulări ulterioare.

Cum să încărcați un font și să modificați glifa în aplicații 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());
    }
});

Lucrul cu tabelele de fonturi prin biblioteca Node.js

OpenType.js oferă dezvoltatorilor acces la tabelele de font subiacente, care stochează informații detaliate despre designul și metricele fontului. Acest lucru poate fi deosebit de util pentru manipulări sau analize avansate ale fonturilor. Fragmentul de cod din exemplul următor demonstrează cum să accesezi tabele specifice de font, cum ar fi tabelul head (care conține informațiile antetului fontului) și tabelul hhea (care conține metricele antetului orizontal). Aceste tabele furnizează detalii esențiale care pot fi utilizate pentru un control precis asupra redării și aranjării fontului.

Cum să accesezi tabelele de font specifice și fontul din interiorul acestuia utilizând biblioteca 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);
  }
});
 Română