PHP Lang
  1. PHP Lang
  3. Изгиб изображения с помощью PHP или HTML5
Intereting Posts
ошибка модели codeigniter: неопределенное свойство Произвольное число полей FORM, готовых для базы данных jQuery Формирование данных формы AJAX с использованием PHP Ajax-вызов, возвращающий пустые данные Как читать изображения из базы данных MySQL с помощью PHP? PDO Несколько запросов: транзакция фиксации и возврата Как IPC между клиентами PHP и сервером C Daemon? Laravel 5.1 – сводная таблица между 3 столами Сохраните выводное изображение в другой каталог с новым именем и расширением Как обновить столбец идентификаторов, начиная с 1 раза Использование CURL в PHP для публикации текстовых данных, начиная с "@" Понимание простого класса с помощью магических методов Доступ к константам класса PHP Разбиение страниц на MySQL приводит к PHP Как использовать PHP для удаления X числа строк с начала текстового файла?

Изгиб изображения с помощью PHP или HTML5

Я ищу для достижения:

преобразование прямоугольного изображения в изогнутую дугу

http://i53.tinypic.com/2gule04.jpg

Я попробовал ответы, упомянутые в Curving, изображение, которое начинается как прямоугольник (загружается пользователем), предпочтительно используя Canvas или JS

Основываясь на ответах, я попытался преобразовать пиксельные мудры, которые не сработали. Чтобы понять подход на основе сетки, вам понадобится набор навыков разработчика 3d-2d, которого у меня нет.

Я разработчик PHP, и я ищу ответ в PHP или HTML5. Я пробовал множество вещей, начиная с холста HTML5 и разбивая изображение на более мелкие части, а затем присоединяюсь к ним, но они, похоже, не работают.

Будет приветствоваться помощь в правильном направлении.

Если вы можете использовать ImageMagick , примеры Circular и Radial Distortion Methods должны быть довольно близкими.

введите описание изображения здесь

Я не знаю, поддерживает ли это расширение PHP ImageMagick (в отличие от вызова ImageMagick из командной строки), но может.

Чтобы добиться аналогичного эффекта, вы хотите попробовать сопоставление текстур, и вам нужны некоторые 2d-3d подразделения и математические навыки. В основном идея состоит в том, чтобы разделить текстуру в треугольниках и сопоставить их с координатой 2d с использованием матрицы преобразования. Сначала проще начать с прямоугольников, а затем использовать изогнутую форму, но я тоже новичок в этом, поэтому я не знаю, действительно ли текстурное сопоставление вообще используется для кривой изображения. Вот пример простого сопоставления текстур: манипуляция изображениями и отображение текстур с использованием холста HTML5? ,

В вышеупомянутой ссылке есть эта подфункция: 

n the following code I assume you have a picture object texture and 4 corners each of which is an object with fields x,y,u,v where x,y are pixel coordinates on the target canvas and u,v are pixel coordinates on texture:

IMO – это информация, достаточная для начала сопоставления текстур.

Положительность заключается в использовании ротоскопической анимации вместо математического твинирования. Другими словами, вы можете добиться такого преобразования с помощью 5 или 6 (или столько, сколько хотите) кадров, которые последовательно рисуются на холсте HTML5 с нужной частотой кадров.

Вы можете легко рисовать каждый кадр с помощью Canvas native API. В вашем случае вам просто нужно нарисовать текст, а затем закрыть путь, как: 

 ctx.beginPath(); ctx.moveTo(...); ctx.arc(...); ctx.lineTo(...); ctx.arc(...); ctx.lineTo(...); ctx.closePath();

и просто отрегулируйте соответствующие значения для каждого кадра.

Это должно быть довольно легко!