Как получить размер одного символа в (веб) шрифте? - PullRequest
2 голосов
/ 26 мая 2011

Я пишу скрипт на Python для генерации файла SVG.Этот SVG-файл использует веб-шрифт (импортированный из веб-шрифтов Google через CSS) для приятного отображения моих текстов.Все хорошо, за исключением того, что мне нужно знать размер (в пикселях) предложения, прежде чем помещать его в мой файл SVG.

Поскольку я начал изучать питон несколько дней назад, я не знаю, возможны ли такие вещи.Google помог мне найти существование Python-модуля ImageFont (из библиотеки изображений Python), но, похоже, ImageFont необходимо загрузить файл шрифта с локального пути, чтобы вычислить размер символа.способ вычисления размера символов на веб-шрифте существует?

Спасибо за вашу помощь.

Ответы [ 2 ]

1 голос
/ 26 мая 2011

Вы можете добиться этого на стороне клиента с помощью JavaScript и DOM SVG.

Первый шаг: создать текстовый элемент и вычислить его длину с помощью метода getComputedTextLength () (http://www.w3.org/TR/SVG11/text.html#InterfaceSVGTextContentElement)

<text id="foo" xml:space="preserve">foo </text>

Затем вычислите длину пути с помощью метода getTotalLength () (http://www.w3.org/TR/SVG11/paths.html#InterfaceSVGPathElement)

И вы можете вычислить, сколько раз вы можете поместить свой текст перед его усечением.

0 голосов
/ 26 мая 2011

Будете ли вы каждый раз использовать один и тот же шрифт?Если это так: захватите локальную копию шрифта, запустите свои тесты локально и кэшируйте их (база данных SQLite? Массив ширин, хранящийся в модуле Python? Эта часть зависит от вас).Однако следует помнить, что ширина предложения, вероятно, не равна сумме ширины его символов из-за кернинга .Если вы хотите быть точным, вам нужно вычислить ширину самого предложения.

Правда ли это нужно делать на сервере?Если ваш клиент, например, веб-браузер, вы можете использовать метод jQuery .width () , чтобы спросить браузер о фактическом размере элемента, или выполнить некоторые манипуляции в вашем собственном JavaScript.

Еще лучше было бы спроектировать SVG с более «жидкой» компоновкой и ожидать, что элемент может увеличиться или уменьшиться до произвольного размера, и использовать простой тупой код, такой как elementtext = elementtext[:100]ограничить его длину до некоторого заданного порогового значения.В основном, убедитесь, что он работает с определенным количеством текста, а затем убедитесь, что вы не будете использовать больше, чем столько текста.Вы не используете Декларацию независимости в качестве текстовой метки, верно?

...