1. Produkti
  2.   Font
  3.   JavaScript
  4.   Typr.js
 
  

Bezmaksas JavaScript bibliotēka fontu parsēšanai un renderēšanai

Atvērtā koda JavaScript fontu apstrādes bibliotēka, kas atbalsta TrueType un OpenType fontu parsēšanu un renderēšanu tieši pārlūkā.

Weba un programmatūras izstrādes jomā tipogrāfija spēlē būtisku lomu, veidojot kopējo lietotāja pieredzi. Lai efektīvi manipulētu ar fontiem un tos attēlotu, izstrādātāji paļaujas uz spēcīgām bibliotēkām, kas vienkāršo šo procesu. Viena no šādām bibliotēkām ir Typr.js – jaudīga JavaScript bibliotēka, kas īpaši izstrādāta fontu parsēšanai un renderēšanai. Tā ir veidota kā viegls risinājums, ļaujot ātri integrēt to web projektiem. Bibliotēka atbalsta visus galvenos tīmekļa pārlūkprogrammas, tostarp Chrome, Firefox, Safari un Edge. Tas nodrošina konsekventu fontu attēlošanu dažādās platformās un ierīcēs.

Typr.js ir jaudīga atvērtā koda JavaScript bibliotēka, kas nodrošina programmatūras izstrādātājiem vieglu un daudzpusīgu risinājumu dažādu veidu fontu failu apstrādei. Tā ļauj pārlasīt un attēlot TrueType un OpenType fontus tieši pārlūkā, likvidējot vajadzību pēc servera puses apstrādes. Tas padara Typr.js par nenovērtējamu rīku tīmekļa dizaineriem un izstrādātājiem, kuri vēlas optimizēt tipogrāfiju savās vietnēs. Bibliotēka pilnībā atbalsta pieejamības funkciju īstenošanu, piemēram, teksta mērogošanu, burtu atstarpes regulēšanu un pielāgotu fontu ielādi, apmierinot lietotājus ar dažādām vajadzībām un daudz ko citu.

Typr.js ir ļoti viegli lietojams un var tikt izmantots dažādās tīmekļa lietojumprogrammās, sākot no vienkāršas teksta attēlošanas līdz sarežģītākiem tipogrāfijas projektiem. Tas atbalsta vienkāršojošas funkcijas, piemēram, fontu ielādēšanu un pārvaldīšanu tīmekļa lapās, fontu dažādu metriku analīzi un izguvi, teksta vieglu manipulēšanu un stilizēšanu tiešsaistē, starptautizācijas un lokalizācijas atbalstu, uzlabotu tipogrāfiju un daudz ko citu. Tā bagātīgais funkciju komplekts, vieglā daba un pārlūkprogrammu saderība padara to par nenovērtējamu rīku tipogrāfijas uzlabošanai tīmeklī.

Previous Next

Sākums ar Typr.js

Ieteicamais veids, kā instalēt Typr.js, ir izmantojot npm. Lūdzu, izmantojiet šo komandu, lai pievienotu Maven atkarību savam projektam.

Instalējiet Typr.js caur npm

 npm install @fredli74/typr --save-dev

Jūs varat arī instalēt to manuāli; lejupielādējiet jaunākos izlaiduma failus tieši no GitHub krātuves.

Fontu ielāde un pārvaldība caur JavaScript API

Atvērtā koda Typr.js nodrošina pilnīgu atbalstu fontu ielādei un pārvaldībai JavaScript lietojumprogrammās. Tas vienkāršo fontu ielādes un pārvaldības procesu tīmekļa lapās. Tas atbalsta dažādus fontu formātus, tostarp TrueType (TTF), OpenType (OTF) un Web Open Font Format (WOFF), ļaujot izstrādātājiem nevainojami integrēt pielāgotus fontus savos projektos. Nodrošinot ērtu fontu pārvaldības saskarni, Typr.js ļauj izstrādātājiem efektīvi kontrolēt fontu ielādi un prioritizēt fontu apakškopas, lai optimizētu veiktspēju.

Pievienojiet SVG tabulas parseri SVG krāsu fontu parsēšanai

Typr.SVG = {};
Typr.SVG.parse = function(data, offset, length)
{
  var bin = Typr._bin;
  var obj = { entries: []};

  var offset0 = offset;

  var tableVersion = bin.readUshort(data, offset);  offset += 2;
  var svgDocIndexOffset = bin.readUint(data, offset);  offset += 4;
  var reserved = bin.readUint(data, offset); offset += 4;

  offset = svgDocIndexOffset + offset0;

  var numEntries = bin.readUshort(data, offset);  offset += 2;

  for(var i=0; i < numEntries ; i++)
  {
    var startGlyphID = bin.readUshort(data, offset);  offset += 2;
    var endGlyphID = bin.readUshort(data, offset);  offset += 2;
    var svgDocOffset = bin.readUint(data, offset);  offset += 4;
    var svgDocLength = bin.readUint(data, offset); offset += 4;

    var svg = bin.readASCII(data, offset0 + svgDocOffset + svgDocIndexOffset, svgDocLength);

    for(var f=startGlyphID; f<=endGlyphID; f++){
      obj.entries[f] = svg;
    }
  }

  return obj;

}

Teksta formatēšana un stila piemērošana caur JavaScript API

Atvērtā koda Typr.js bibliotēka ļauj programmatūras izstrādātājiem viegli piemērot dažādus teksta formatēšanas veidus JavaScript lietojumprogrammās. Ar Typr.js izstrādātāji var bez piepūles manipulēt un stilizēt tekstu tīmekļa lapās. Tā nodrošina plašu teksta izkārtojuma funkciju klāstu, piemēram, rindas pārtraukšanu, teksta izlīdzināšanu un pārrēķināšanu, ļaujot precīzi kontrolēt, kā teksts tiek attēlots. Turklāt bibliotēka atbalsta plašu teksta stilizācijas iespēju klāstu, tostarp burtu atstarpi, vārdu atstarpi un teksta dekorāciju, ļaujot izstrādātājiem radīt vizuāli pievilcīgu un salasāmu tekstu.

Teksta formatēšana un stila piemērošana JavaScript lietotnēs

// Assume that Typr.js library is already loaded

// Define the target element where the text will be formatted and styled
const targetElement = document.getElementById('myTextElement');

// Load and parse the font file using Typr.js
Typr.loadFont('path/to/font.ttf', (font) => {
  // Font loading is complete
  
  // Apply the loaded font to the target element
  targetElement.style.fontFamily = font.name.fontFamily;

  // Set text content for the target element
  targetElement.textContent = 'Hello, Typr.js!';

  // Apply text styling
  targetElement.style.fontSize = '24px';
  targetElement.style.letterSpacing = '2px';
  targetElement.style.wordSpacing = '4px';
  targetElement.style.textDecoration = 'underline';

  // Additional text layout adjustments
  targetElement.style.textAlign = 'center';
  targetElement.style.lineHeight = '1.5';
  targetElement.style.textJustify = 'inter-word';
});

Kerning un ligatūras caur JavaScript API

Typr.js ļauj programmatūras izstrādātājiem izmantot uzlabotas tipogrāfijas iespējas, piemēram, kerningu un ligatūras, lai uzlabotu teksta vizuālo pievilcību. Kerning pielāgo attālumu starp konkrētām rakstzīmju pāriem, lai uzlabotu kopējo lasāmību, savukārt ligatūras aizstāj rakstzīmju secības ar vizuāli pievilcīgām alternatīvām. Izmantojot šīs iespējas, izstrādātāji var sasniegt izsmalcinātāku un harmoniskāku tipogrāfiju tīmeklī.

 Latviski