Как лучше всего рисовать текст на элементе HTML-холста?

Question

К сожалению, элемент canvas плохо обрабатывает текст. Существует множество подходов (см., Например, http://canvaspaint.org/blog/2006/12/rendering-text/), но в большинстве случаев они выглядят как хаки. Что я могу сделать, это кроссплатформенность и дает мне большую гибкость, чтобы мои шрифты были такими, как я хочу?

Answer 1

Если вы хотите использовать текстовые методы HTML5, попробуйте эту библиотеку: http://code.google.com/p/canvas-text/ Я главный разработчик, поэтому я могу помочь и внести изменения очень быстро.

Демоверсии здесь: http://canvas -text.googlecode.com / svn / trunk / examples / index.html

Он все еще находится в стадии альфа, поэтому любые сообщения об ошибках и отзывы приветствуются! :)

Answer 2

Вы смотрели на typeface.js, http://typeface.neocracy.org. Я слышал, это довольно хорошо для написания текста. Вот с их сайта:

"typeface.js использует возможности векторного рисования браузеров для рисования текста в документах HTML. В течение некоторого времени браузеры имели поддержку векторного рисования - Firefox, Safari и Opera поддерживают элемент <canvas> (а также SVG), а IE поддерживает VML.

Проект typeface.js имеет два компонента: модуль perl для преобразования шрифтов и библиотека javascript для рисования в браузере. Модуль perl извлекает информацию о структуре глифа из шрифтов TrueType и записывает эти данные в формате JSON. Затем библиотека javascript обходит HTML-документ и отображает текст, используя <canvas> или VML для рисования глифов.

В браузерах, которые поддерживают <canvas>, текст выбирается, но вы должны верить. Когда вы выбираете, нет обратной связи, нет выделения, чтобы вы знали, что это работает. Дальнейшая работа будет направлена ​​на улучшение межбраузерной поддержки выделения текста с выделением. "(Цитата из http://typeface.neocracy.org/usage.html)