¿Es posible usar Google Fonts ( https://www.google.com/fonts ) en Draw.io?
fuente
¿Es posible usar Google Fonts ( https://www.google.com/fonts ) en Draw.io?
Si bien draw.io no permite, según mi conocimiento, importar fuentes, quería publicar lo que funciona para mí. Tienes que usar un navegador con capacidad de extensión como Chrome o Firefox (estoy usando Chrome para capturas de pantalla).
Para comenzar, obtenga la extensión "Elegante" para su navegador ( Chrome , Firefox ). A continuación, abra las opciones de extensión y haga clic en el botón "Escribir nuevo estilo".
Desde aquí necesitarás:
Ingrese la URL de Google Font en el cuadro de texto. Quería importar los iconos de material de Google a draw.io, así que mi ejemplo usa:
@import url('https://fonts.googleapis.com/icon?family=Material+Icons');
Nota: Probablemente desee establecer su "Mapa de teclas" (abajo a la izquierda en la imagen) en "básico" si aún no lo está. Esto hace que copiar / pegar sea más simple.
Asegúrese de que "Se aplica al campo" (debajo del cuadro de texto) esté configurado en "URL en el dominio" y que el valor sea "draw.io". Esto asegurará que la importación se aplique a la aplicación web draw.io. Puede usar esta misma técnica para cualquier aplicación web que admita fuentes personalizadas.
Nota sobre la fuente del icono: dado que estoy usando iconos de material en este caso, usé el nombre del icono como texto (ligadura de fuente). Por ejemplo, para la estrella, inserté un cuadro de texto e inserté "estrella" (según el nombre de la página de iconos de materiales ) y me aseguré de que la fuente estuviera configurada en "Iconos de materiales". Para nombres con espacios, asegúrese de utilizar guiones bajos (por ejemplo, "star_border").
Ejemplo con fuente de texto:
@import url('https://fonts.googleapis.com/css?family=Indie+Flower');
Intenté un poco las guías anteriores pero no pude hacer que funcionen. Luego hice la pregunta en la página de grupos de google de draw.io, y me informaron que el campo personalizado es para fuentes instaladas localmente en su sistema.
Escribió lo siguiente que podría ayudar a alguien que se encontró con esta publicación a través de google:
Haga clic en el campo Fuente personalizada y escriba el nombre de la fuente que ha instalado (no es necesario ponerla entre comillas o guiones bajos, etc.).
Vea un ejemplo que he adjuntado a https://groups.google.com/d/msg/drawio/mjJR6pRVTmo/T0Lrhr45AgAJ
fuente
Tropecé con esto mientras enfrentaba dificultades para agregar Fuente personalizada (específicamente una Fuente de Google) a draw.io (versión de escritorio). Resultó que estaba usando 12.1.7, que tiene una forma menos simple de agregar fuentes personalizadas.
Encontré el siguiente enlace después de una búsqueda en Google, publicación fechada el 2 de diciembre de 2019, pero no se menciona la versión. Verificó la actualización y actualizó draw.io a 13.0.1, ahí lo tiene:
https://drawio-app.com/external-fonts-in-draw-io/
Esta es la solicitud de función en GitHub: https://github.com/jgraph/drawio/issues/577
fuente
Quicksand
Fuentes instaladas descargándolas de Google Fonts.System Fonts
Opción utilizada para configurar, por ejemploQuicksand-Thin
No he podido encontrar una manera de usar algunas de las fuentes más nuevas de Google, pero puede usar algunas de las más comunes / populares seleccionando "personalizado" en la sección de fuentes y escribiendo el nombre de la fuente ( por ejemplo, "Avenir Next", "Oswald", etc.) y luego usará esa fuente. En el lado positivo, también parece reconocer ciertas fuentes populares que no están en las fuentes de Google y sería costoso comprarlas (por ejemplo, Myriad Pro).
fuente
Puede agregar el enlace completo, por lo que en lugar de simplemente escribir 'Heebo' en el campo personalizado, puede escribir
<\link href="https://fonts.googleapis.com/css?family=Heebo:500" rel="stylesheet"\>
. Todavía funciona un poco con errores al cambiar las fuentes después, pero me llevó más lejos.O ... simplemente vaya a la pestaña 'estilo' y haga clic en 'editar' estilo. Agregue el enlace de arriba y cambie la familia de fuentes.
fuente