Как поставить изображение на другое изображение - PullRequest
4 голосов
/ 18 февраля 2012

У меня есть следующий скрипт

<div class="left">
<img src="image1.jpg" height="186" width="160" /> 
</div>

<div class="center">
<img src="image2.jpg" height="186" width="160" /> 
</div>

<div class="right">
<img src="image3.jpg" height="186" width="160" /> 
</div>

, который генерирует следующее: Figure-2

У меня есть эта простая форма для загрузки изображения:

<form action="upload/image" method="post">
<input type="file" name="upload_image" />
<input type="submit" />
</form>

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

Теперь после загрузки изображения кружки будут выглядеть следующим образом: Figure-2(After uploading image)

Figure-2

Теперь, если вы любезно посмотрите на изображение выше, вы увидитезагруженное изображение прикреплено к кружке таким образом, как будто оно было разработано с помощью Photoshop, но на самом деле это не так.

Теперь мой вопрос: не могли бы вы, пожалуйста, скажите мне, как вставить загруженное изображение на все три изображения кофейной кружки и сделать их похожими на рисунок 2.

Спасибо заAdvance:)

PS Я получил идею с этого сайта-> http://www.zazzle.com/cr/design/pt-mug

Я пытаюсь достичь того же, что есть на сайте (я пытался так долго, но пока нетрезультат ... не удалось поместить загруженное изображение на изображения кружки).

Вот ссылка для скачивания изображения, которое я использовал здесь http://i43.tinypic.com/d66h4.png

1 Ответ

1 голос
/ 18 февраля 2012

Да, вы можете сделать это.

Если вы изучаете данный URL с Zazzle.com, после загрузки изображения он вызывает программу на своем сервере - "designall.dll".Он творит все волшебство.

Как упоминали другие наши друзья, достичь этого эффекта просто невозможно с помощью HTML, CSS и JavaScript (без использования Canvas).

Но с использованием некоторого сервераВ сторонней программе вы можете достичь этого без каких-либо проблем.

Поскольку я программирую на LAMP, я даю решение реализовать то же самое с помощью PHP и ImageMagick.

  • Пользователь загружает изображение.
  • Изображение будет отправлено во внутренний файл PHP.
  • PHP будет искажать изображение в соответствии с нашими требованиями.
  • Создает три копии и сохраняет их во временной папке с уникальным идентификатором.
  • В ответ на это мы получим некоторый код успеха.
  • Как только мы получим код успеха, мы загрузим изображения из временной папки.
  • Когда пользователь нажимает на изображение любого типа, мы будем обновлять изображение по мере необходимости.

А что касается фактического кода искажения, вы можете использовать плагин ImageMagick.

Дополнительную информацию о плагине ImageMagick можно найти по адресу: Веб-сайт ImageMagick

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

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

Пожалуйста, дайте мне знать, еслиЯ что-то упускаю.

Друзья, пожалуйста, помогите "black_belt" с лучшими решениями, если таковые имеются.

Спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...