samsa core Download - samsa core Source Download

samsa core

ดาวน์โหลดแบบอักษร

1.0.0

ดาวน์โหลด

Samsa-core

ไลบรารีสำหรับการประมวลผลไฟล์ตัวอักษร Truetype

คุณสมบัติ:

รูปแบบ
avar1 และ avar2
colrv0 และ colrv1
รุ่น SVG
รูปร่าง:
- GSUB (รวมถึง ligatures พื้นฐานและอิโมจิ)
- GPOS (รวมถึง kerning คู่คลาสที่มีข้อยกเว้น)
- รูปแบบการเปลี่ยนแปลงคุณสมบัติ
- การเลือกสคริปต์และภาษา

repo นี้ใช้สำหรับการพัฒนาเวอร์ชัน 2 เวอร์ชัน 1 ได้รับการจัดการใน Samsa GUI Repo

วิธีใช้

ขั้นตอนสำคัญคือ:

โหลดไฟล์ตัวอักษรลงใน ArrayBuffer
สร้างวัตถุ Samsabuffer จาก ArrayBuffer
สร้างวัตถุ samsafont จาก samsabuffer
สร้างวัตถุ samsainstance จาก samsafont
เรียก renderText() บน samsainstance เพื่อรับสตริง SVG

นี่คือโค้ดตัวอย่างสำหรับ node.js ที่โหลด filename จากดิสก์สร้างวัตถุ samsafont สร้างวัตถุ Samsainstance พร้อมแกนแปรผันที่ตั้งไว้ในสถานที่บางแห่งทำให้สตริง hello, world! เป็น SVG จากนั้นบันทึก SVG ไปยังไฟล์ render.svg

 const nodeBuffer = fs . readFileSync ( filename ) ;
const arrayBuffer = nodeBuffer . buffer ;
const samsaBuffer = new SamsaBuffer ( arrayBuffer ) ;
const font = new SamsaFont ( samsaBuffer ) ;
const instance = font . instance ( { wght : 900 , wdth : 200 } ) ;
const svg = instance . renderText ( { text : "hello, world!" , fontSize : 72 } ) ;
fs . writeFileSync ( "render.svg" , svg ) ;

ในเบราว์เซอร์คุณจะได้รับ ArrayBuffer และประมวลผลในทำนองเดียวกัน SVG ที่เกิดขึ้นสามารถแทรกลงใน DOM

 const samsaBuffer = new SamsaBuffer ( arrayBuffer ) ;
const font = new SamsaFont ( samsaBuffer ) ;
const instance = font . instance ( { wght : 900 , wdth : 200 } ) ;
const svg = instance . renderText ( { text : "hello, world!" , fontSize : 72 } ) ;
document . getElementById ( "myDiv" ) . innerHTML = svg ;

หากโหลดไฟล์ตัวอักษรจาก URL ระยะไกลคุณอาจใช้ fetch() จากนั้น response.arrayBuffer() เพื่อรับ ArrayBuffer หากมีการลากไฟล์ตัวอักษรลงบนเบราว์เซอร์ ArrayBuffer จะได้รับโดยการแจกแจงอาร์เรย์ e.dataTransfer.items โดยที่ e คือเหตุการณ์ Drop สำหรับแต่ละ item ในอาร์เรย์ (อาจมีหลายรายการ) หากคุณสมบัติ kind ของมันเท่ากับ file ตั้งค่า file = item.getAsFile() และ promise file.arrayBuffer() จะให้ ArrayBuffer

แผนภาพการไหล

แผนภาพแสดงให้เห็นว่า Samsa สร้างวัตถุ Samsafont จาก ArrayBuffer สร้าง Samsainstance จาก Samsafont จากนั้นแสดงข้อความเป็น SVG

 ผังงาน TD
    f1 [ttf] -> a [arraybuffer]
    f2 [woff2] -> a [arraybuffer]
    A [ArrayBuffer] -> B [Samsabuffer]
    b -> c [samsafont]
    b [samsabuffer] -> | "samsabuffer.decodewoff2 ()" | c [samsafont]
    c -> | "samsafont.instance (Axissettings)" | D (Samsainstance)
    d -> | "samsainstance.rendertext ({text: mytext, fontsize: mysize, color: mycolor})" | E (SVG)