Создание динамического изображения

Я почти уверен, что вы не можете сделать это в JavaScript / jQuery. Во всяком случае, без какого-то плагина.

Также немного странно хранить текст в виде изображения.

Вы можете изучить возможность использования одной из служб, которые это делают. Большинство из них делают миниатюры в соответствии с тем, что вкусно использует. Но http://www.webshotspro.com/ похоже, что он может делать полные разрешения. Есть ли способ использовать их API, чтобы получить снимок экрана, а затем вырезать нужный фрагмент? Это действительно зависит от того, что / зачем вам это нужно.

Вы можете использовать движок браузера для визуализации страницы как изображения, а затем вырезать требуемый раздел страницы.

Я не знаю, есть ли расширение jquery или php, которое делает это за вас, но вы можете использовать вызов exec и использовать, например, CutyCapt для рендеринга страницы и расширение обработки изображений для ее обрезки. Сам программу не тестировал, но это только начало.

Определенно не делайте этого на клиенте, даже если есть способ сделать это (js и элемент холста), вам придется верить клиенту (и спамеры могут использовать его, чтобы показывать вам рекламу вместо ваших частичных снимков экрана), быть в зависимости от клиентских шрифтов, настроек цвета и т. д.

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

Я буду:

1. Подумайте, действительно ли мне нужно сделать это таким образом, и есть ли лучшее решение исходной проблемы (вам нужно отображать части сайта в изображениях, почему именно? Может ли кеширование этой части html помочь? Или Iframe?)
2. Если да, сделайте это с помощью графических библиотек, поддерживаемых PHP, таких как GD, вам придется составить чертеж самостоятельно, возможно, есть некоторые библиотеки, которые позволят сделать это на более высоком уровне (заполнение области макета текстом вместо ручного разделения построчно и т. д.)

Чего именно вы пытаетесь достичь этим?

Подпись к изображениям в стиле LOLcat? Я бы использовал Gd2 и напрямую изменил изображение.

Упрощенный макет веб-страницы? Вероятно, быстрее кэшировать исходный код div. Я также предлагаю создать несколько вручную и сравнить полученные размеры передачи файлов, я бы поспорил почти во всех обстоятельствах (исходное изображение HTML +) меньше, чем (результирующее изображение).

Если вы полны решимости визуализировать изображение, вы должны

1. вызвать автономный веб-браузер или
2. встроить движок (X) HTML-рендеринга, или
3. ограничить параметры ввода, чтобы вы могли написать (значительно упрощенный) пользовательский рендерер, или
4. делегировать работу внешней службе

Все это зависит от операционной системы сервера, доступного на нем программного обеспечения и имеющихся у вас прав доступа.

1. в Windows: вызовите IE с помощью автоматизации COM; в Linux: см. http://www.chimeric.de/blog/2007/1018_automated_screenshots_using_bash_firefox_and_imagemagick

2. в Windows: см. http://msdn.microsoft.com/en-us/library/system.windows.forms.webbrowser.aspx; в Linux см. http://webkit.org/building/build.html или http://khtml2png.sourceforge.net/ Вы также можете рассмотреть привязки PHP-Qt или PHP-GTK.

Надеюсь, это поможет.

«У меня есть образец div, который предоставляется пользователю для его изменения. Он содержит два изображения и некоторый текст. Он может выбрать изображение из многих, которые мы предлагаем. Наконец, я хочу сохранить его как одно большое изображение».

В этом случае снимок экрана на стороне клиента - неправильный способ решения этой проблемы. Вы должны разрешить компоновку изображения в браузере пользователя (поскольку это звучит так, как будто вы уже сделали эту часть), но затем попросите браузер отправить обратно информацию, необходимую для воссоздания изображения * на сервере, что вы затем делаете с GD, ImageMagick или что-то подобное. Это будет проще, чище и быстрее во многих отношениях :)

*Например:

• imageid: 7
• текст: 'бла'
• textcolour: #ffffff
• размер текста: 3
• textx: 10
• текст: 10

Обновлено: вам, вероятно, также следует указать цитируемую часть в вопросе, поскольку это не совсем ясно из исходного сообщения.