ดาวน์โหลด jscad text - ดาวน์โหลดซอร์สโค้ด jscad text

jscad text

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

1.0.0

ดาวน์โหลด

jscad-ข้อความ

สร้างโครงร่างข้อความโดยใช้แบบอักษร TTF

โปรเจ็กต์นี้ประกอบด้วยชุดฟังก์ชันที่สร้างโครงร่างข้อความ 2 มิติโดยใช้ฟอนต์ TTF

ภาพรวม

โปรเจ็กต์ JSCAD ไม่ได้จัดเตรียมความสามารถในการใช้ฟอนต์ TTF เมื่อสร้างโครงร่างของข้อความ (รองรับเฉพาะฟอนต์ SIMPLEX เท่านั้น) ดังนั้นจึงมีการสร้างชุดฟังก์ชันพิเศษเพื่อเสริม JSCAD

หมายเหตุ: เนื่องจากลักษณะของฟอนต์ TTF ไลบรารีนี้จึงไม่สามารถใช้ผ่าน JSCAD Web UI ได้ อ่านต่อ...

โดยพื้นฐานแล้วไลบรารีนี้จะขึ้นอยู่กับไลบรารี 'opentype.js' มันเป็นห้องสมุดที่เจ๋งมากซึ่งทำสิ่งที่เนียนมาก คลายการบีบอัดแบบอักษร อ่านเนื้อหา และสร้างโครงสร้างคล้าย SVG

แต่ก่อนหน้านั้น ต้องมีไฟล์ฟอนต์ TTF ให้ใช้งานได้ ระบบปฏิบัติการทั้งหมดมาพร้อมกับฟอนต์ตั้งแต่หนึ่งฟอนต์ขึ้นไป และฟอนต์เหล่านั้นสามารถใช้ได้หากคุณพบ สามารถดาวน์โหลดแบบอักษรได้จากเว็บไซต์

มีสองตัวอย่าง; อันหนึ่งสำหรับอ่านไฟล์ฟอนต์ในเครื่อง และอันหนึ่งสำหรับดาวน์โหลดฟอนต์จาก Google Fonts

สารบัญ

การติดตั้ง
ตัวอย่าง
โครงการ
หมายเหตุพิเศษ
ใบอนุญาต

การติดตั้ง

สำหรับโปรเจ็กต์ที่ใช้ Node.js แพ็คเกจนี้สามารถติดตั้งได้โดยใช้ NPM

 npm install jscad-text

สำหรับโปรเจ็กต์แบบสแตนด์อโลน สามารถดาวน์โหลดแพ็คเกจนี้และรวมเป็นส่วนประกอบได้

ดาวน์โหลดแพ็คเกจจาก GitHub
คลายซิปเนื้อหาซึ่งจะสร้างไดเร็กทอรีชื่อ 'jscad-text'
คัดลอกไดเร็กทอรี 'jscad-text' ไปยังโปรเจ็กต์ที่ใหญ่กว่า

ตัวอย่าง

แต่ละตัวอย่างเป็นโครงการ NPM แบบสแตนด์อโลนขนาดเล็ก localfont และ googlefont

โครงการแบบอักษรท้องถิ่น

โปรเจ็กต์นี้ใช้งานง่ายที่สุด เนื่องจากฟอนต์ถูกอ่านจากไฟล์ในเครื่อง เพียงค้นหาแบบอักษรที่สวยงามแล้วคัดลอกไฟล์ลงในโฟลเดอร์ localFont

MacOS : ดูที่ /Library/Fonts หรือ /System/Library/Fonts
หน้าต่าง :
ลินุกซ์ :

ตั้งค่า:

 npm install
cd localfont
ln -s ../../jscad-text ./jscad-text
cd ..

การดำเนินการ:

 npm run example

และเปิด 'localfont/index.svg' โดยใช้เบราว์เซอร์ใดก็ได้

เนื้อหาของ 'index.js' สามารถแก้ไขได้เพื่อเปลี่ยนเส้นทางไปยังไฟล์ฟอนต์ หรือเปลี่ยนตัวเลือกเป็นฟังก์ชัน textToPaths() นี่เป็นการออกแบบ JSCAD ทั่วไป และสามารถปรับเปลี่ยนเพื่อทำสิ่งที่คุณต้องการด้วยพาธ

โครงการแบบอักษรของ Google

โปรเจ็กต์นี้ได้รับแบบอักษรจากเว็บไซต์ Google Fonts เพียงไปที่นั่น ค้นหาแบบอักษร 'ตระกูล' ดีๆ แล้วจดชื่อลงไป

ห้องสมุดเจ๋งๆ อีกแห่งที่เรียกว่า 'node-fetch' กำลังถูกใช้เพื่อดาวน์โหลดแบบอักษรจากอินเทอร์เน็ต

ตั้งค่า:

 cd googlefont
npm install
ln -s ../../jscad-text ./jscad-text

การดำเนินการ:

 npm run cli

และเปิด 'text.svg' โดยใช้เบราว์เซอร์ใดก็ได้

โครงการ

ยังอยู่...

ต่อไปนี้เป็นวิธีใช้ไลบรารีนี้ภายในโปรเจ็กต์ (การออกแบบ JSCAD)

หากยังไม่ได้สร้างโฟลเดอร์ใหม่สำหรับโปรเจ็กต์ (ตัวอย่างนี้ใช้ 'newproject' เป็นชื่อโฟลเดอร์)

ดาวน์โหลดไลบรารีนี้ แตกไฟล์ และคัดลอกทุกอย่างไปยังโฟลเดอร์โปรเจ็กต์ คลิกที่รหัสสีเขียวด้านบน และเลือกดาวน์โหลด ZIP

ตอนนี้ ค้นหาแบบอักษรแล้วคัดลอกลงในโฟลเดอร์โปรเจ็กต์

ภายในโฟลเดอร์โปรเจ็กต์ ให้สร้างไฟล์ชื่อ index.js และเพิ่มโค้ดต่อไปนี้

 const { primitives } = require('@jscad/modeling')

const { loadFontFromData, textToPaths } = require('./jscad-text-master')

const fs = require('fs')

const main = (params) => {
  const data = fs.readFileSync('newproject/Habana.ttf') // CHANGE THIS TO THE FONT FILE NAME

  const font = loadFontFromData(data)

  const paths = textToPaths({font, segments: 144}, 'JSCAD ROCKS!!')

  return paths
}

module.exports = { main }

เกือบจะถึงแล้ว ตอนนี้ดาวน์โหลดไลบรารี opentype.js จากที่นี่ https://github.com/opentypejs/opentype.js แตกไฟล์เนื้อหาและคัดลอก opentype.js/dist/opentype.js ไปที่ newproject/jscad-text-master/src/opentype.js

เสร็จแล้ว!

ตอนนี้ เพียงลากและวางโฟลเดอร์โปรเจ็กต์ลงในเว็บไซต์ JSCAD