Este proyecto contiene un conjunto de funciones que producen contornos de texto 2D utilizando fuentes TTF.
El proyecto JSCAD no ofrece la posibilidad de utilizar fuentes TTF al crear contornos de texto (solo admite fuentes SIMPLEX). Por lo tanto, se ha creado un conjunto especial de funciones para complementar JSCAD.
NOTA: Debido a la naturaleza de las fuentes TTF, esta biblioteca no se puede utilizar a través de la interfaz de usuario web de JSCAD. Sigue leyendo...
Básicamente, esta biblioteca depende de la biblioteca 'opentype.js'. Es una biblioteca realmente genial que hace algunas cosas ingeniosas; descomprime la fuente, lee el contenido y produce estructuras tipo SVG.
Pero incluso antes de eso, debe estar disponible un archivo de fuente TTF. Todos los sistemas operativos vienen con una o más fuentes, y se pueden usar si puede encontrarlas. Las fuentes también se pueden descargar de sitios web.
Hay dos ejemplos; uno que lee archivos de fuentes locales y otro que descarga fuentes de Google Fonts.
Para proyectos basados en Node.js, este paquete se puede instalar usando NPM.
npm install jscad-text
Para proyectos independientes, este paquete se puede descargar e incluir como componente.
Cada uno de los ejemplos es un pequeño proyecto independiente de NGP; fuente local y fuente de google.
Este proyecto es el más fácil de usar, ya que las fuentes se leen desde archivos locales. Simplemente busque una buena fuente y copie el archivo en la carpeta localFont.
Configuración:
npm install
cd localfont
ln -s ../../jscad-text ./jscad-text
cd ..
Ejecución:
npm run example
Y abra 'localfont/index.svg' usando cualquier navegador.
El contenido de 'index.js' se puede modificar para cambiar la ruta al archivo de fuente o cambiar las opciones de la función textToPaths(). Este también es un diseño JSCAD típico y se puede modificar para hacer lo que quieras con las rutas.
Este proyecto obtiene fuentes del sitio web de Google Fonts. Simplemente vaya allí, busque una bonita 'familia' de fuentes y escriba el nombre.
Se está utilizando otra biblioteca interesante llamada 'node-fetch' para descargar la fuente de Internet.
Configuración:
cd googlefont
npm install
ln -s ../../jscad-text ./jscad-text
Ejecución:
npm run cli
Y abra 'text.svg' usando cualquier navegador.
Todavía ahí...
Entonces, aquí se explica cómo usar esta biblioteca dentro de un proyecto (diseño JSCAD).
Si aún no lo ha hecho, cree una nueva carpeta para el proyecto. (Este ejemplo utiliza 'nuevo proyecto' como nombre de carpeta).
Descargue esta biblioteca, descomprímala y copie todo a la carpeta del proyecto. Haga clic en el CÓDIGO verde de arriba y seleccione Descargar ZIP.
Ahora, busque una fuente y cópiela en la carpeta del proyecto.
Dentro de la carpeta del proyecto, cree un archivo llamado index.js y agregue el siguiente código.
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 }
Casi llegamos. Ahora descargue la biblioteca opentype.js desde aquí; https://github.com/opentypejs/opentype.js Descomprima el contenido y copie opentype.js/dist/opentype.js en newproject/jscad-text-master/src/opentype.js
¡Hecho!
Ahora, simplemente arrastre y suelte la carpeta del proyecto en el sitio web de JSCAD.
ESTE PROYECTO SOLO FUNCIONA CON JSCAD V2.
Consulte la Guía del usuario para obtener algunos consejos.
La licencia MIT (MIT)