Intereting Posts
PHP – Почему while (mysql_fetch_array (mysql_query ())) петли? Как получить окончательный URL-адрес после перенаправления HTTP в чистом PHP? API Google Analytics исключает исключение «invalid_grant» с учетной записью службы. Тот же код на двух серверах. Только один работает Laravel – принудительный выход определенного пользователя по идентификатору пользователя Формы Symfony Generator, Doctrine и M: N Как я могу объединить все дубликаты в массиве на основе ценности одного ключа? post checkbox value AWS S3 Многостраничная загрузка, когда не указывается исходный файл SQLSTATE Невозможно подключиться к серверу MySQL на ошибке «127.0.0.1» (61) Laravel 4.1 Использование PHP в заявлении IF для javascript PHP Curl добавляет '\' для отправки апострофа символов на PHP, но ASP-сервер Нужно получить номер строки в строке соответствия текстовому файлу php ssh2_exec не выполняет команду su Получить элементы заказа и WC_Order_Item_Product в Woocommerce 3 Принять функцию как параметр в PHP

лучший способ конвертировать div в изображение? используя php, javascript или jquery

У меня есть div, содержащий изображения:

<div id="Created_Design"> <img src="images/image1.png" style="position: absolute; left: 8px; top: 172px;"> <img src="images/image2.png" style="position: absolute; left: 20px; top: 144px"> </div> 

Я хочу экспортировать этот div, чтобы создать образ, создающий нечто вроде генератора проекта. До сих пор то, что я сделал, – это создать новый дизайн в новом окне, используя window.open, как предварительный просмотр дизайна.

Поэтому мои вопросы:

  1. Могу ли я преобразовать этот div и сохранить его непосредственно как изображение?
  2. Я думал об экспорте этого на холст, чтобы сохранить его как изображение. Как я могу экспортировать это на холст?
  3. Есть ли другой способ сделать это?

Я отвечу на ваш вопрос о переносе того, что у вас есть на холст. Я написал сообщение здесь .

То, что вы делаете, читает изображения и их позицию css, сверху и слева. Затем скопируйте его в холст.

(код с головы, может быть ошибкой)

 // Loop over images and call the method for each image node $('#Created_Design').children(function() { drawImage(this.src, this.style.left, this.style.top); }); function drawImage(src, x, y) { var ctx = document.getElementById('canvas').getContext('2d'); var img = new Image(); img.onload = function() { ctx.drawImage(img, x, y); }; img.src = src; } 

Вы можете рисовать изображения из div на холсте с помощью метода drawImage() , после чего вы можете получить полученное изображение с toDataURL() base64 с использованием toDataURL() .

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