Блог разработчиков

Все разделы | CMS Joomla 2.5 | Общее | PHP | Javascript + jQuery

Динамичное изменение изображения с помощью Imagemagick (image.php v.1.0)

23 ноября 2014

На данный момент скрипт состоит из двух файлов, самого сценария image.php и картинки circle.png (зачем он нужен разберем позже). Все эти файлы должны быть размещены на сервере в одной папке. Для вызова скрипта в адресной строке нужно прописать полный путь до него, например, /images/image.php. Путь до скрипта и будет адресом создаваемого изображения и этот адрес в дальнейшем будет использоваться как аттрибут src у тега img.

Параметры скрипта

Параметр Описание параметра Пример
file Путь до исходного изображения (обязательный) images/img.jpg
format Формат изображения на выходе, в случае если включен параметр circle, format будет игнорироваться, подставится png jpg/png/gif
quality Качество изображения на выходе. По умолчанию качество 90. Работает только с jpg и jpeg. 10/20/30/90/100
width Ширина изображения в px 220
height Высота изображения в px 180
sepia Эффект сепии. Указывается от 0 до 100 70
annotate Текст на картинке Изображение
annotate_color Цвет текста на изображении blue/white/black/red
annotate_size Размер шрифта в px 14
annotate_pos_left Позиция текста на картинке слева в px 10
annotate_pos_top Позиция текста на картинке сверху в px 10
circle Включает круг, изображение центрируется и добавляется в круг, все остальное удаляется. Результат в png true/false
blur Включает эффект размытия. Значение от 0 до 10 3

 

Примеры использования

Изменение формата

<img src='image.php?file=images/img.jpg&format=gif' alt='' />

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

Изменение качества

Указание формата в данном случае обязательно, так как изменить качество картинки можно только в формате jpg, поэтому в качестве аттрибута format следует указывать jpg или jpeg.

<img src='image.php?file=images/img.jpg&format=jpg&quality=50' alt='' />

Результат выполнения будет таким

Качество 50

Качество 100

 

Оптимальный вариант использовать качество 90. При таком качестве визуальнокартинка почти не будет отличатся от картинки с качеством в 100, а уменьшение веса файла почти в 2 раза.

Изменение размеров изображения

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

Пример записи

<img src='image.php?file=images/img.jpg&format=jpg&width=200' alt='' />

Результат выполнения следующий

Горизонтальный прямоугольник

<img src='image.php?file=images/img.jpg&format=jpg&width=200&height=150' alt='' />

Вертикальный прямоугольник

<img src='image.php?file=images/img.jpg&format=jpg&width=150&height=200' alt='' />

Эффект сепии

Добавляет к картинке эффект сепии. Указывается в диапазоне от 0 до 100.

Пример использования

<img src='image.php?file=images/img.jpg&format=jpg&sepia=70' alt='' />

С изменением размера

<img src='image.php?file=images/img.jpg&format=jpg&width=150&height=200&sepia=70' alt='' />

Текст на картинке

Добавляет текст на изображение. Пример использования.

<img src='image.php?file=images/img.jpg&format=jpg&annotate=Francis Neves&annotate_color=pink&annotate_size=30&annotate_pos_left=20&annotate_pos_top=500' alt='' />

Результат выполнения

Создание окружности из исходного изображения

Новое избражение создается в формате png и игнорирует атрибуты format и quality, размер картинки указывать обязательно. Например

<img src='image.php?file=images/img.jpg&width=200&circle=true' alt='' />

Результат выполнения будет следующим

Можно добавлять эффекты, например, сепия

<img src='image.php?file=images/img.jpg&width=200&circle=true&sepia=70' alt='' />

Эффект размытия

Атрибут размытия blur указывается в промежутке от 0 до 10. Например

<img src='image.php?file=images/img.jpg&blur=3' alt='' />

Результат выполнения скрипта

Вместе с сепией

<img src='image.php?file=images/img.jpg&blur=3&sepia=70' alt='' />

Сделать кружок

<img src='image.php?file=images/img.jpg&blur=3&width=250&circle=true' alt='' />

Скачать скрипт можно по этой ссылке