Fabric.js + Google Fonts - PullRequest
       17

Fabric.js + Google Fonts

2 голосов
/ 20 февраля 2012

Можно ли использовать Fabric.js с веб-шрифтами, не подключая библиотеку Cufon и ее шрифты? Я легко могу сделать это с помощью стандартной функциональности Canvas, поэтому мне интересно, возможно ли это в Fabric.

Ответы [ 3 ]

6 голосов
/ 20 февраля 2012

Мы планируем в ближайшее время отказаться от Cufon в пользу нативных текстовых методов. Мы включили Cufon ~ 2 года назад, когда нативные текстовые методы были не очень кроссбраузерными (см. мой тест в те дни). Как только мы уроним его, он, вероятно, станет необязательным модулем, если важна совместимость с более старыми клиентами.

4 голосов
/ 04 февраля 2015

Первая ссылка Google шрифта в <head>

<link href='http://fonts.googleapis.com/css?family=Oswald|Lobster|Fontdiner+Swanky|Crafty+Girls|Pacifico|Satisfy|Gloria+Hallelujah|Bangers|Audiowide|Sacramento' rel='stylesheet' type='text/css'>

Создать div / span

<span class="txtFont" style="font-family:Oswald" onclick="change_font_family('Oswald')">Oswald</span>

В Javascript

function change_font_family(font_family)
{
   canvas.getActiveObject().set("fontFamily", font_family);
   canvas.renderAll();
}
1 голос
/ 08 мая 2017

У меня была проблема как раз в этот раз.

Вы должны загрузить шрифт в DOM прежде, чем вы можете использовать его в канве с тканью.

Так что вы можетесоздайте элемент, который имеет атрибут style с нужным шрифтом.

Для некоторых моя работа может быть интересной.Я создаю выбор, где пользователь может выбрать шрифт.В этом выберите каждый получить атрибут font-family.

Посмотрите на это: enter image description here

Почему новый ответ?Потому что ключом в магазине является шрифт, который не был упомянут напрямую.

...