Ini memberi Anda akses ke bentuk huruf teks dari browser atau node.js.
Lihat https://opentype.js.org/ untuk demo langsung.
glyf dan PostScript cff Outline)Pilih salah satu sumber berikut dalam contoh berikutnya:
<!-- using global declaration -->
< script src =" https://your.favorite.cdn/opentype.js " > </ script >
< script > opentype . parse ( ... ) </ script >
<!-- using module declaration (need full path) -->
< script type = module >
import { parse } from "https://unpkg.com/opentype.js/dist/opentype.mjs" ;
parse ( ... ) ;
</ script >npm install opentype.js const opentype = require ( 'opentype.js' ) ;
import opentype from 'opentype.js'
import { load } from 'opentype.js'Menggunakan naskah? Lihat contoh ini
Jika Anda berencana untuk meningkatkan atau men -debug opentype.js, Anda dapat:
git clone git://github.com/yourname/opentype.js.gitcd opentype.jsnpm installnpm run buildnpm run start dan Navigasi ke Folder /docsnpm run test Ini dilakukan dalam dua langkah: Pertama, kami memuat file font ke dalam ArrayBuffer ...
// either from an URL
const buffer = fetch ( '/fonts/my.woff' ) . then ( res => res . arrayBuffer ( ) ) ;
// ... or from filesystem (node)
const buffer = require ( 'fs' ) . promises . readFile ( './my.woff' ) ;
// ... or from an <input type=file id=myfile> (browser)
const buffer = document . getElementById ( 'myfile' ) . files [ 0 ] . arrayBuffer ( ) ; ... lalu kita .parse() menjadi Font instance
// if running in async context:
const font = opentype . parse ( await buffer ) ;
console . log ( font ) ;
// if not running in async context:
buffer . then ( data => {
const font = opentype . parse ( data ) ;
console . log ( font ) ;
} )Kompresi Woff2 Brotli berkinerja 29% lebih baik daripada pendahulunya. Tetapi kompresi ini juga lebih kompleks, dan akan menghasilkan perpustakaan OpenType.js yang jauh lebih berat (> 10 ×!) (≈120kb => ≈1400kb).
Untuk menyelesaikan ini: mendekompres font sebelumnya (misalnya dengan fontello/wawoff2).
// promise-based utility to load libraries using the good old <script> tag
const loadScript = ( src ) => new Promise ( ( onload ) => document . documentElement . append (
Object . assign ( document . createElement ( 'script' ) , { src , onload } )
) ) ;
const buffer = //...same as previous example...
// load wawoff2 if needed, and wait (!) for it to be ready
if ( ! window . Module ) {
const path = 'https://unpkg.com/[email protected]/build/decompress_binding.js'
const init = new Promise ( ( done ) => window . Module = { onRuntimeInitialized : done } ) ;
await loadScript ( path ) . then ( ( ) => init ) ;
}
// decompress before parsing
const font = opentype . parse ( Module . decompress ( await buffer ) ) ;Dimungkinkan juga untuk membuat font dari awal dengan mendefinisikan setiap jalur mesin terbang Bézier.
// this .notdef glyph is required.
const notdefGlyph = new opentype . Glyph ( {
name : '.notdef' ,
advanceWidth : 650 ,
path : new opentype . Path ( )
} ) ;
const aPath = new opentype . Path ( ) ;
aPath . moveTo ( 100 , 0 ) ;
aPath . lineTo ( 100 , 700 ) ;
// more drawing instructions...
const aGlyph = new opentype . Glyph ( {
name : 'A' ,
unicode : 65 ,
advanceWidth : 650 ,
path : aPath
} ) ;
const font = new opentype . Font ( {
familyName : 'OpenTypeSans' ,
styleName : 'Medium' ,
unitsPerEm : 1000 ,
ascender : 800 ,
descender : - 200 ,
glyphs : [ notdefGlyph , aGlyph ] } ) ; Setelah Anda memiliki objek Font (dari kerajinan atau dari .parse() ) Anda dapat menyimpannya kembali sebagai file.
// using node:fs
fs . writeFileSync ( "out.otf" , Buffer . from ( font . toArrayBuffer ( ) ) ) ;
// using the browser to createElement a <a> that will be clicked
const href = window . URL . createObjectURL ( new Blob ( [ font . toArrayBuffer ( ) ] ) , { type : "font/opentype" } ) ;
Object . assign ( document . createElement ( 'a' ) , { download : "out.otf" , href } ) . click ( ) ;Font mewakili file font OpenType yang dimuat. Ini berisi satu set mesin terbang dan metode untuk menggambar teks pada konteks gambar, atau untuk mendapatkan jalur yang mewakili teks.
glyphs : Daftar objek mesin terbang yang diindeks.unitsPerEm : Koordinat x/y dalam font disimpan sebagai bilangan bulat. Nilai ini menentukan ukuran kisi. Nilai umum adalah 2048 dan 4096 .ascender : Jarak dari garis dasar ascender tertinggi. Dalam unit font, bukan piksel.descender : Jarak dari garis dasar keturunan terendah. Dalam unit font, bukan piksel. Font.getPath(text, x, y, fontSize, options)Buat jalur yang mewakili teks yang diberikan.
x : Posisi horizontal awal teks. (default: 0 )y : Posisi vertikal dari garis dasar teks. (default: 0 )fontSize : Ukuran teks dalam piksel (default: 72 ).options : {GlyphrenderOptions} diteruskan ke setiap mesin terbang, lihat di bawahOpsi adalah Opsional {GlyphrenderOptions} yang mengandung objek:
script : Script yang digunakan untuk menentukan fitur mana yang akan diterapkan (default: "DFLT" atau "latn" )language : Sistem bahasa yang digunakan untuk menentukan fitur mana yang akan diterapkan (default: "dflt" )kerning : Jika true memperhitungkan informasi kerning (default: true )features : Objek dengan tag fitur OpenType sebagai kunci, dan nilai boolean untuk mengaktifkan setiap fitur. Saat ini hanya fitur ligatur "liga" dan "rlig" yang didukung (default: true ).hinting : Jika true menggunakan font truetype mengisyaratkan jika tersedia (default: false ).colorFormat : Warna format dikonversi menjadi rendering (default: "hexa" ). Dapat menjadi "rgb" / "rgba" untuk output rgb() / rgba() , "hex" / "hexa" untuk 6/8 digit warna hex, atau "hsl" / "hsla" untuk output hsl() / hsla() . "bgra" mengeluarkan objek dengan r, g, b, tombol (r/g/b dari 0-255, a dari 0-1). "raw" menghasilkan bilangan bulat seperti yang digunakan dalam tabel CPAL.fill : Warna font, warna yang digunakan untuk membuat setiap mesin terbang (default: "black" ) Catatan: Ada juga Font.getPaths() dengan argumen yang sama, yang mengembalikan daftar jalur.
Font.draw(ctx, text, x, y, fontSize, options)Buat jalur yang mewakili teks yang diberikan.
ctx : Konteks gambar 2D, seperti kanvas.x : Posisi horizontal awal teks. (default: 0 )y : Posisi vertikal dari garis dasar teks. (default: 0 )fontSize : Ukuran teks dalam piksel (default: 72 ).options : {GlyphrenderOptions} diteruskan ke setiap mesin terbang, lihat Font.getPath()Opsi adalah objek opsional yang berisi:
kerning : Jika true , memperhitungkan informasi kerning (default: true )features : Objek dengan tag fitur OpenType sebagai kunci, dan nilai boolean untuk mengaktifkan setiap fitur. Saat ini hanya fitur ligatur "liga" dan "rlig" yang didukung (default: true ).hinting : Jika true menggunakan font truetype mengisyaratkan jika tersedia (default: false ). Font.drawPoints(ctx, text, x, y, fontSize, options) Gambarlah titik semua mesin terbang dalam teks. Poin-poin di kurva akan ditarik dengan warna biru, titik-titik di luar kurva akan ditarik dengan warna merah. Argumennya sama dengan Font.draw() .
Font.drawMetrics(ctx, text, x, y, fontSize, options)Gambar garis yang menunjukkan pengukuran font penting untuk semua mesin terbang dalam teks. Garis hitam menunjukkan asal sistem koordinat (titik 0,0). Garis biru menunjukkan kotak pembatas mesin terbang. Garis hijau menunjukkan lebar maju dari mesin terbang.
Font.stringToGlyphs(string)Konversi string ke daftar objek mesin terbang. Perhatikan bahwa tidak ada korespondensi 1-ke-1 yang ketat antara daftar string dan mesin terbang karena kemungkinan substitusi seperti ligatur. Daftar mesin terbang yang dikembalikan bisa lebih besar atau lebih kecil dari panjang string yang diberikan.
Font.charToGlyph(char) Konversi karakter ke objek mesin terbang. Kembali null jika mesin terbang tidak dapat ditemukan. Perhatikan bahwa fungsi ini mengasumsikan bahwa ada pemetaan satu-ke-satu antara karakter yang diberikan dan mesin terbang; Untuk skrip yang kompleks, ini mungkin tidak terjadi.
Font.getKerningValue(leftGlyph, rightGlyph) Ambil nilai pasangan kerning antara mesin terbang kiri (atau indeksnya) dan mesin terbang kanan (atau indeksnya). Jika tidak ada pasangan kerning ditemukan, kembalikan 0 . Nilai kerning ditambahkan ke lebar muka saat menghitung jarak antar mesin terbang.
Font.getAdvanceWidth(text, fontSize, options)Mengembalikan lebar muka sebuah teks.
Ini adalah sesuatu yang berbeda dari Path.getBoundingBox() ; Misalnya, whitespace yang sufiks meningkatkan kemajuan tetapi bukan kotak pembatas atau surat yang menggantung seperti kaligrafi 'F' mungkin memiliki kotak pembatas yang cukup besar daripada lebar mukanya.
Ini sesuai dengan canvas2dContext.measureText(text).width
fontSize : Ukuran teks dalam piksel (default: 72 ).options : {GlyphrenderOptions} , lihat Font.getPath() Font.palettes ( PaletteManager )Ini memungkinkan untuk mengelola palet dan warna di tabel CPAL, tanpa harus memodifikasi tabel secara manual.
Font.palettes.add(colors)Tambahkan palet baru.
colors : (Opsional) Warna untuk ditambahkan ke palet, perbedaan palet yang ada akan diisi dengan nilai default. Font.palettes.delete(paletteIndex)Menghapus palet dengan indeks berbasis nol
paletteIndex : Indeks palet berbasis nol Font.palettes.deleteColor(colorIndex, replacementIndex)Menghapus indeks warna tertentu di semua palet dan memperbarui semua lapisan menggunakan warna itu dengan warna yang saat ini disimpan dalam indeks pengganti
colorIndex : Indeks warna yang harus dihapusreplacementIndex : Indeks (sesuai dengan palet sebelum dihapus) dari warna untuk diganti dalam lapisan menggunakan warna untuk dihapus Font.palettes.cpal()Mengembalikan tabel cpal font, atau salah jika tidak ada. Digunakan secara internal.
Font.palettes.ensureCPAL(colors)Terutama digunakan secara internal. Pastikan bahwa tabel CPAL ada atau diisi dengan nilai default.
colors : (Opsional) Warna untuk dihasilkan pada kreasi kembali true jika dibuat, false jika sudah ada. Font.palettes.extend(num)Perpanjang semua palet yang ada dan nilai Numpaletteentries dengan sejumlah slot warna
num : Jumlah slot warna tambahan untuk ditambahkan ke semua palet Font.palettes.fillPalette(palette, colors, colorCount) Isi satu set warna palet (dari indeks palet, atau array nilai warna cpal yang disediakan dengan satu set warna, jatuh kembali ke nilai warna default, sampai jumlah yang diberikan. Itu tidak memodifikasi palet yang ada, mengembalikan array baru sebagai gantinya! Gunakan Font.palettes.setColor() sebagai gantinya jika diperlukan.
palette : Indeks palet atau array nilai warna cpal untuk mengisi palet dengan, sisanya akan diisi dengan warna defaultcolors : Array nilai warna untuk mengisi palet dengan, dalam format yang didukung sebagai output dari colorFormat di {GlyphrenderOptions} , lihat Font.getPath() . Nama warna CSS juga didukung dalam konteks browser.colorCount : Jumlah warna untuk mengisi palet dengan, default ke nilai bidang Numpaletteentries Font.palettes.getAll(colorFormat)Mengembalikan array array nilai warna untuk setiap palet, secara opsional dalam format warna yang ditentukan
colorFormat : (Opsional) Lihat {GlyphrenderOptions} di Font.getPath() , (default: "hexa" ) Font.palettes.getColor(index, paletteIndex, colorFormat)Dapatkan palet tertentu dengan indeks berbasis nol
index : Indeks berbasis nol warna di paletpaletteIndex : Indeks palet berbasis nol (default: 0)colorFormat : (Opsional) Lihat {GlyphrenderOptions} di Font.getPath() , (default: "hexa" ) Font.palettes.get(paletteIndex, colorFormat)Dapatkan palet tertentu dengan indeks berbasis nol
paletteIndex : Indeks palet berbasis nolcolorFormat : (Opsional) Lihat {GlyphrenderOptions} di Font.getPath() , (default: "hexa" ) Font.palettes.setColor(index, colors, paletteIndex)Atur satu atau lebih warna pada palet tertentu dengan indeks berbasis nol
index : indeks warna berbasis nol untuk mulai mengisicolor : Nilai warna atau array nilai warna dalam notasi warna yang didukung sebagai output dari colorFormat di {GlyphrenderOptions} , lihat Font.getPath() . Nama warna CSS juga didukung dalam konteks browser.paletteIndex : Indeks palet berbasis nol (default: 0) Font.palettes.toCPALcolor(color)Mengonversi string nilai warna menjadi nilai warna integer cpal
color : String dalam notasi warna yang didukung sebagai output dari colorFormat di {GlyphrenderOptions} , lihat Font.getPath() . Nama warna CSS juga didukung dalam konteks browser. Font.layers ( LayerManager )Ini memungkinkan untuk mengelola lapisan lapisan mesin terbang di tabel Colr, tanpa harus memodifikasi tabel secara manual.
Font.layers.add(glyphIndex, layers, position)Menambahkan satu atau lebih lapisan ke mesin terbang, di akhir atau pada posisi tertentu.
glyphIndex : Indeks Glyph untuk menambahkan lapisan ke.layers : Lapisan Objek {Glyph, PaletteIndex}/{Glyphid, PaletteIndex} atau Array Objek Lapisan.position : Posisi untuk memasukkan lapisan di (akan default untuk ditambahkan di akhir). Font.layers.ensureCOLR()Terutama digunakan secara internal. Memastikan bahwa tabel Colr ada dan diisi dengan nilai default.
Font.layers.get(glyphIndex)Mendapat lapisan untuk mesin terbang tertentu
glyphIndex mengembalikan array {glyph, paletteIndex} Layer Objects. Font.layers.remove(glyphIndex, start, end = start)Menghapus satu atau lebih lapisan dari mesin terbang.
glyphIndex : INDEKS GLYPH untuk menghapus lapisan daristart : Indeks untuk menghapus lapisan diend : (opsional) Jika disediakan, menghapus semua lapisan dari indeks awal ke (dan termasuk) indeks akhir Font.layers.setPaletteIndex(glyphIndex, layerIndex, paletteIndex)Menetapkan properti PaletteIndex Lapisan Glyph Color ke Indeks baru
glyphIndex : Glyph dalam font oleh indeks glyph berbasis nollayerIndex : Layer di Glyph by Nol Based Layer IndexpaletteIndex : Warna baru untuk disetel untuk lapisan dengan indeks berbasis nol dalam palet apa pun Font.layers.updateColrTable(glyphIndex, layers)Terutama digunakan secara internal. Memperbarui tabel Colr, menambahkan baseglyphrecord jika diperlukan, memastikan bahwa itu dimasukkan pada posisi yang benar, memperbarui numlayers, dan menyesuaikan nilai FirstLayerIndex untuk semua baseglyphrecords sesuai dengan penghapusan atau penyisipan.
Font.variation ( VariationManager ) VariationManager menangani properti font variabel menggunakan tabel variasi font openType.
Font.variation.activateDefaultVariation()Mengaktifkan variasi default dengan mengatur data variasinya sebagai opsi render default font. Menggunakan instance default jika tersedia; Jika tidak, itu default ke koordinat semua sumbu.
Font.variation.getDefaultCoordinates()Mengembalikan koordinat default untuk sumbu variasi font.
Font.variation.getDefaultInstanceIndex() Menentukan dan mengembalikan indeks instance variasi default. Mengembalikan -1 jika tidak dapat ditentukan.
-1 . Font.variation.getTransform(glyph, coords) Hanya jalan pintas untuk Font.variation.process.getTransform() .
Font.variation.getInstanceIndex(coordinates) Temukan indeks instance variasi yang cocok dengan koordinat yang disediakan, atau -1 jika tidak ada yang cocok.
coordinates : Objek dengan tag sumbu sebagai kunci dan nilai variasi sebagai nilai yang sesuai.-1 . Font.variation.getInstance(index)Mengambil variasi spesifik dengan indeks berbasis nol.
index : Indeks berbasis nol dari instance variasi.null jika indeks tidak valid. Font.variation.set(instanceIdOrObject)Menetapkan koordinat variasi yang akan digunakan secara default untuk rendering dalam opsi render default font.
instanceIdOrObject : Baik indeks berbasis nol dari instance variasi atau tag sumbu pemetaan objek ke nilai variasi. Font.variation.get()Mendapat pengaturan variasi saat ini dari opsi render default font.
Font.variation.process ( VariationProcessor ) VariationProcessor adalah komponen dari VariationManager , terutama digunakan secara internal untuk menghitung dan menerapkan variasi untuk mesin terbang dalam font variabel. Ini menangani transformasi dan penyesuaian berdasarkan sumbu dan instance variabel font.
Font.variation.process.getNormalizedCoords(coords)Mengembalikan koordinat yang dinormalisasi untuk sumbu variasi berdasarkan pengaturan saat ini.
coords : Obyek koordinat untuk menormalkan (atau koordinasi variasi dalam font defaultRenderOptions font) secara default)Font.variation.process.interpolatePoints(points, deltas, scalar)Poin interpolasi berdasarkan delta yang disediakan dan nilai skalar.
points : Array poin asli.deltas : Array Point Deltas.scalar : Nilai skalar untuk interpolasi.Font.variation.process.deltaInterpolate(original, deltaValues, scalar)Menghitung nilai interpolasi untuk satu titik yang diberikan nilai asli, delta, dan skalar.
original : Nilai asli poin.deltaValues : Array nilai delta untuk titik tersebut.scalar : Nilai skalar untuk interpolasi.Font.variation.process.deltaShift(points, deltas)Menerapkan nilai delta untuk memindahkan titik.
points : Array poin asli.deltas : Array delta untuk diterapkan.Font.variation.process.transformComponents(components, transformation)Transformasi komponen mesin terbang menggunakan matriks transformasi yang ditentukan.
components : Komponen Glyph.transformation : Matriks Transformasi Untuk Terapkan.Font.variation.process.getTransform(glyph, coords)Mengambil salinan mesin terbang yang diubah berdasarkan koordinat variasi yang disediakan, atau mesin terbang itu sendiri jika tidak ada variasi yang diterapkan
glyph : Glyph atau Index of Glyph to Transform.coords : Objek Variasi Koordinasi (atau koordin variasi dalam font defaultRenderOptions font secara default)opentype.Glyph Font.variation.process.getVariableAdjustment(adjustment)Menghitung penyesuaian variabel untuk parameter penyesuaian yang diberikan.
adjustment : Parameter penyesuaian.Font.variation.process.getDelta(deltas)Memilih nilai delta yang sesuai dari kumpulan delta berdasarkan pengaturan variasi saat ini.
deltas : Kumpulan Nilai Delta.Font.variation.process.getBlendVector()Menghitung vektor campuran untuk interpolasi berdasarkan pengaturan saat ini.
Mesin terbang adalah tanda individu yang sering sesuai dengan karakter. Beberapa mesin terbang, seperti ligatur, adalah kombinasi dari banyak karakter. Mesin terbang adalah blok bangunan dasar font.
font : Referensi ke objek font.name : Nama Glyph (mis. "Aring" , "five" )unicode : Nilai unicode utama dari mesin terbang ini (dapat undefined ).unicodes : Daftar nilai unicode untuk mesin terbang ini (sebagian besar waktu ini akan menjadi 1 , juga bisa kosong).index : Nomor indeks mesin terbang.advanceWidth : Lebar untuk memajukan pena saat menggambar mesin terbang ini.leftSideBearing : Jarak horizontal dari karakter sebelumnya ke asal ( 0, 0 ); Nilai negatif menunjukkan overhangxMin , yMin , xMax , yMax : Kotak pembatas mesin terbang.path : Jalur mesin terbang yang mentah dan tidak berskala. Glyph.getPath(x, y, fontSize, options, font)Dapatkan objek jalur mesin terbang berskala untuk digunakan pada konteks gambar.
x : Posisi horizontal dari mesin terbang. (default: 0 )y : Posisi vertikal dari garis dasar mesin terbang. (default: 0 )fontSize : Ukuran font dalam piksel (default: 72 ).options : {GlyphrenderOptions} , lihat Font.getPath()font : Objek Font, Diperlukan untuk Rendering Font Colr/Cpal untuk mendapatkan lapisan dan warna Glyph.getBoundingBox() Hitung kotak pembatas minimum untuk jalur yang tidak dikenakan dari mesin terbang yang diberikan. Mengembalikan objek opentype.BoundingBox yang berisi x1 / y1 / x2 / y2 . Jika mesin terbang tidak memiliki poin (misalnya karakter ruang angkasa), semua koordinat akan menjadi nol.
Glyph.draw(ctx, x, y, fontSize, options, font)Gambar mesin terbang pada konteks yang diberikan.
ctx : Konteks gambar.x : Posisi horizontal dari mesin terbang. (default: 0 )y : Posisi vertikal dari garis dasar mesin terbang. (default: 0 )fontSize : Ukuran font, dalam piksel (default: 72 ).options : {GlyphrenderOptions} , lihat Font.getPath()font : Objek Font, Diperlukan untuk Rendering Font Colr/Cpal untuk mendapatkan lapisan dan warna Glyph.drawPoints(ctx, x, y, fontSize, options, font) Gambarlah titik -titik mesin terbang pada konteks yang diberikan. Poin-poin di kurva akan ditarik dengan warna biru, titik-titik di luar kurva akan ditarik dengan warna merah. Argumennya sama dengan Glyph.draw() .
Glyph.drawMetrics(ctx, x, y, fontSize) Gambar garis yang menunjukkan pengukuran font penting untuk semua mesin terbang dalam teks. Garis hitam menunjukkan asal sistem koordinat (titik 0,0). Garis biru menunjukkan kotak pembatas mesin terbang. Garis hijau menunjukkan lebar maju dari mesin terbang. Argumennya sama dengan Glyph.draw() .
Glyph.toPathData(options) , Glyph.toDOMElement(options) , Glyph.toSVG(options) , Glyph.fromSVG(pathData, options) ,Ini saat ini hanya fungsi pembungkus untuk rekan -rekan mereka pada objek jalur (lihat dokumentasi di sana), tetapi dapat diperluas di masa depan untuk meneruskan data mesin terbang untuk perhitungan otomatis.
Glyph.getLayers(font)Mendapat lapisan lapisan mesin terbang untuk mesin terbang ini dari tabel Colr/Cpal font yang ditentukan
Setelah Anda memiliki jalur melalui Font.getPath() atau Glyph.getPath() , Anda dapat menggunakannya.
commands : Perintah Path. Setiap perintah adalah kamus yang berisi jenis dan koordinat. Lihat di bawah untuk contoh.fill : Warna isi jalan. Warna adalah string yang mewakili warna CSS. (default: 'black' )stroke : Warna stroke dari Path . Warna adalah string yang mewakili warna CSS. (Default: null ; jalur tidak akan dibelai)strokeWidth : Ketebalan garis Path . (Default: 1 , tetapi jika stroke null tidak ada stroke yang akan ditarik) Path.draw(ctx) Gambarlah jalan pada konteks 2D yang diberikan. Ini menggunakan sifat fill , stroke , dan strokeWidth dari objek jalur.
ctx : Konteks gambar. Path.getBoundingBox() Hitung kotak pembatas minimum untuk jalur yang diberikan. Mengembalikan objek opentype.BoundingBox yang berisi x1 / y1 / x2 / y2 . Jika jalurnya kosong (misalnya karakter ruang angkasa), semua koordinat akan menjadi nol.
Path.toPathData(options)Konversi jalur ke string instruksi data jalur. Lihat https://www.w3.org/tr/svg/paths.html#pathdata
options :decimalPlaces : Jumlah tempat desimal untuk nilai titik mengambang. (default: 2 )optimize : Terapkan beberapa optimisasi ke data jalur, misalnya menghapus perintah yang tidak perlu/duplikat (benar/false, default: true )flipY : Apakah akan membalik sumbu Y dari data jalur, karena jalur SVG dan font menggunakan sumbu Y terbalik. ( true : Hitung dari kotak pembatas, false : nonaktifkan; default: true )flipYBase : Nilai dasar untuk perhitungan pembalik dasar. Anda mungkin ingin menghitung ini dari nilai ascender dan descender font. (Default: secara otomatis menghitung dari kotak pembatas data jalur) Path.toSVG(options) Konversikan jalur ke elemen SVG <path> , sebagai string.
options : lihat Path.toPathData() Path.fromSVG(pathData, options)Ambil jalur dari data jalur SVG.
Entah menimpa data jalur untuk jalur yang ada:
const path = new Path ( ) ;
path . fromSVG ( 'M0 0' ) ;Atau membuat jalur baru secara langsung:
const path = Path . fromSVG ( 'M0 0' ) ;pathData : Entah string perintah jalur svg, atau (hanya dalam konteks browser) SVGPathElementoptions :decimalPlaces , optimize , flipY , flipYBase : lihat Path.toPathData()scale : Nilai penskalaan diterapkan untuk semua koordinat perintah (default: 1 )x / y : Offset diterapkan ke semua koordinat perintah pada sumbu x atau y (default: 0 ) {type: 'M', x: 100, y: 200}{type: 'L', x: 100, y: 200}{type: 'C', x1: 0, y1: 50, x2: 100, y2: 200, x: 100, y: 200}{type: 'Q', x1: 0, y1: 50, x: 100, y: 200}{type: 'Z'} Kami menggunakan SEMVER untuk versi.
Mit
Kami ingin mengakui pekerjaan orang lain yang tanpanya opentype.js tidak mungkin: