Превью картинки на PHP

Хочу поделиться решением для вывода на сайте картинок нужного размера «на лету».
Эту идею я заметил в другой реализации, но в конечном виде это совсем самостоятельная программа.

Суть такова
Залили сырой файл произвольного размера (пусть будет /images/image.jpg).
Чтобы получить нужный размер в браузер (например надо уместить картинку в рамку 150х100), в теге img пишем

И получаем то, что просили.

Такой запрос преобразуется в .htaccess и перенаправляется на нужный скрипт, который делает ресайз по заданным параметрам (если ресайзнутой картинки еще нет), сохраняет измененную копию картинки (если разрешили сохранять) для последующих запросов и выдает в браузер готовое изображение.

Решение — это файл thumb.php (нужный скрипт) и несколько строчек в .htaccess
Принимаем, что файл thumb.php находится в /includes, т.е. /includes/thumb.php
Картинки, с которыми работаем — это image/jpeg, image/pjpeg (блин, вот еще придумали. натолкнулся, когда заливали файлы после майкрософтовского офисного пакета), image/gif, image/png

В файле .htaccess пишем (RewriteEngine уже должен быть «on»):

..И добавляем файл thumb.php в папку /includes

Теперь, если в браузере написать адрес картинки с параметрами GET — сервер выдаст измененную картинку

Рассмотрим параметры GET. Они таковы:

Здесь:
w (width) — ширина, в которую надо вписать
h (height) — высота, в которую надо вписать
Если указан только один параметр, то сделает по нему, например картинку надо вписать в высоту 100, тогда пишем ?h=100 и все
Если вписать без обрезки в рамку, например 150х100, то пишем ?w=150&h=100 — впишет по максимальной подходящей размерности

Дальше больше.
Если нужно «жестко» вписать в рамку, например сделать картинку 100х100, чтоб заполняла все пространство (обрезка), то пишем
?w=100&h=100&c
Здесь параметр «c» (crop) указывает на то, что надо картинку уменьшить и обрезать по рамке
И просто превью с размерами по умолчанию можно сделать если написать
?t — вписывание в рамку по умолчанию
?tc — обрезка по рамке с размерами по умолчанию

Параметры можно комбинировать.

Размеры превью по умолчанию задаются в самом thumb.php (сейчас 150х150)
Запись превью на диск разрешается, если в сессии определена переменная THUMB

Далее приведены возможные форматы имен создаваемых на диске превью (опять же, если превью разрешено сохранять на диск), в зависимости от заданных параметров.
Пусть оригинальный файл — image.jpg и размер его 800х600 и вот параметры:

Здесь размеры после image_ — это реальный рамер картинки после уменьшения.

Как работает thumb.php
1. Смотрит, есть ли указанный оригинальный файл. Если нет, то ничего не делает.
2. Вычисляет размеры превью по параметрам и определяет имя файла превью
3. Смотрит, есть ли такой файл превью, если есть и дата его создания позже даты создания оригинала, то выдает превью, иначе создает превью заново.
4. Выдает превью и сохраняет, если надо.

Посмотреть и поиграть с параметрами можно здесь: t.8080.spb.ru/i/17.jpg
Это ссылка на оригинальный файл, если туда добавить описанные выше параметры, то соответственно, выдаст, что спросили.

Что мы получили?
— Разрешаем пользователю заливать в CMS все что угодно, но на странице сайта выводим картинки только нужного размера.
— Простое решение для средне-мелких сайтов

Данное решение работает на GD

Что еще можно (вариации для размышления):
Можно расширить список типов фалов в пределах GD
Можно добавить автоматическое удаление всех превью, если оригинальный файл изменился, хотя этот пункт лучше отдать на откуп CMS
Можно создавать simlink для превью с нужными именами, когда например запросы ?w=100&h=100 и w=101&h=100 приводят к одинаковому результату
Можно расширить, если есть симлинки, так, чтобы RewriteEngine сам проверял по параметрам в запросе наличие файла и обходил скрипт

Спасибо за внимание. Буду рад если это пригодится.

UPD 2011-01-16: Теперь файл лежит здесь:

Last edited by Дмитрий Герасимов on Sun Jan 16, 2011 11:51 pm; edited 4 times in total

Действительно, похоже.
Видимо недостаточно внимательно просмотрел топики, хотя интересовался подобными идеями.
Какое-то пространство мыслей все-таки существует.
Но здесь еще есть идея прозрачной прослойки, созданной таким образом на сервере, что когда указываем удаленный файл через URL с параметрами в fopen(), например, то получаем уже преобразованную инстанцию, без задействования дополнительных скриптов. Такое поведение в рамках создания глобальной базы знаний (вроде web 2.0) считаю целесообразным.
Спасибо.

Смысл таков — скрипт установлен у меня на хостинге, нужно сделать в браузере превью на изображение с другого сайта по имеющемуся прямому линку.
Как это все прописать в адресной строке (т.е. адрес на скрипт + адрес на само изображение + параметры ресайза) или подскажите как это в тег img запихнуть?

Прошу помощи с вашим классом.
Он как раз то что мне нужно, но нет одной функции, а именно поворота картинки.

добавл «rotate»
тоесть запрос вывода фотографии с новым последним параметром: thumb.php?name=IMG_0964.JPG&w=350&h=150&c&rotate=-90

Вот эта цифра «-90» — вытаскивается из фотографии на основе ориентации фотоаппарата.

Всё крутится, но если изображение в оригинале сфотографировано на боку, то при разворачивании изображения появляется черная полоса. В других случаях всё работает идеально.
Помогите пожалуйста адаптировать.

Вот, то что у меня. Где исправить?

class Thumbnail
<
private $w ;
private $h ;
private $filename ;
private $crop ;

private $_mime_settings ;
private $_fsave_allowed ;
private $_tname_tpl = ‘%s_%sx%s’ ;
private $_default_width = 150 ;
private $_default_height = 150 ;
private $_jpeg_quality = 90 ;
private $_sess_varname = ‘THUMB’ ;
//ДОБАВЛЕНО
private $_default_rotate = 0 ;
//ДОБАВЛЕНО

public function __construct ( )
<
session_start (www.php.net/session_start) ( ) ;

$this -> w = abs (www.php.net/abs) ( ( int ) @ $_GET [ ‘w’ ] ) ;
$this -> h = abs (www.php.net/abs) ( ( int ) @ $_GET [ ‘h’ ] ) ;
if ( ! $this -> w && ! $this -> h ) <
// вписать в рамку по умолчанию
$this -> w = $this ->_default_width;
$this -> h = $this ->_default_height;
>
$this -> filename = @ $_GET [ ‘name’ ] ;

$this -> crop = isset (www.php.net/isset) ( $_GET [ ‘c’ ] ) || isset (www.php.net/isset) ( $_GET [ ‘tc’ ] ) ;

$this ->_fsave_allowed = isset (www.php.net/isset) ( $_SESSION [ $this ->_sess_varname ] ) ;

$this ->_run ( ) ;
>
private function _run ( )
<

//ДОБАВЛЕНО
$new_rotate_tmp = $_GET [ ‘rotate’ ] ;
if ( ! $new_rotate_tmp ) <
$new_rotate_tmp = $default_rotate ;
>
$new_rotate = $new_rotate_tmp ;
//ДОБАВЛЕНО

if ( ! file_exists (www.php.net/file_exists) ( $this -> filename ) || ! is_file (www.php.net/is_file) ( $this -> filename ) ) exit (www.php.net/exit);
$info = getimagesize (www.php.net/getimagesize) ( $this -> filename ) ;
if ( ! $info || ! isset (www.php.net/isset) ( $this ->_mime_settings [ $info [ ‘mime’ ] ] ) ) <
// можно возвращать дефолтную картинку
// .. и удалять лишние картинки
//$files = glob(«<$name>_*<$ext>«);
//glob(«*.txt»)

$orig_width = $info [ 0 ] ;
$orig_height = $info [ 1 ] ;
$dst_x = $dst_y = 0 ;

if ( ! $this -> w ) <
// вписываем по высоте
$new_width = $this -> w = floor (www.php.net/floor) ( $orig_width * $this -> h / $orig_height ) ;
$new_height = $this -> h ;
>
elseif ( ! $this -> h ) <
// вписываем по ширине
$new_width = $this -> w ;
$new_height = $this -> h = floor (www.php.net/floor) ( $orig_height * $this -> w / $orig_width ) ;
>
elseif ( $this -> crop ) <
// вписываем с обрезкой

$scaleW = $this -> w / $orig_width ;
$scaleH = $this -> h / $orig_height ;
$scale = max (www.php.net/max) ( $scaleW , $scaleH ) ;
$new_width = floor (www.php.net/floor) ( $orig_width * $scale ) ;
$new_height = floor (www.php.net/floor) ( $orig_height * $scale ) ;
$dst_x = floor (www.php.net/floor) ( ( $this -> w — $new_width ) / 2 ) ;
$dst_y = floor (www.php.net/floor) ( ( $this -> h — $new_height ) / 2 ) ;
>
else <
// вписываем без обрезки
$scaleW = $this -> w / $orig_width ;
$scaleH = $this -> h / $orig_height ;
$scale = min (www.php.net/min) ( $scaleW , $scaleH ) ;
$new_width = $this -> w = floor (www.php.net/floor) ( $orig_width * $scale ) ;
$new_height = $this -> h = floor (www.php.net/floor) ( $orig_height * $scale ) ;
>

if ( $this -> w > $orig_width || $this -> h > $orig_height ) <
header (www.php.net/header) ( ‘Content-type: ‘ . $info [ ‘mime’ ] ) ;
readfile (www.php.net/readfile) ( $this -> filename ) ;
exit (www.php.net/exit);
>

// $this_filename = imagerotate($this->filename, $new_rotate, 0);

$thumbFilename = dirname (www.php.net/dirname) ( $this -> filename ) . ‘/’
. sprintf (www.php.net/sprintf) ( $this ->_tname_tpl, basename (www.php.net/basename) ( $this -> filename , $settings [ ‘ext’ ] ) , $this -> w , $this -> h )
. $settings [ ‘ext’ ]
;

$orig_img = call_user_func (www.php.net/call_user_func) ( $settings [ ‘create’ ] , $this -> filename ) ;
//ДОБАВЛЕНО
$orig_img = imagerotate ( $orig_img , $new_rotate , 0 ) ;
//ДОБАВЛЕНО
$tmp_img = imagecreatetruecolor ( $this -> w , $this -> h ) ;
// Copy and resize old image into new image
imagecopyresampled (
$tmp_img , $orig_img ,
$dst_x , $dst_y ,
0 , 0 , /*лево_право верх_низ*/
$new_width , $new_height ,
$orig_width , $orig_height
) ;

imagedestroy ( $orig_img ) ;
header (www.php.net/header) ( ‘Content-type: ‘ . $info [ ‘mime’ ] ) ;
call_user_func (www.php.net/call_user_func) ( $settings [ ‘save’ ] , $tmp_img , $thumbFilename ) ;
imagedestroy ( $tmp_img ) ;
exit (www.php.net/exit);
>

private function _gif_save ( $img , $filename = false )
<
if ( $filename !== false && $this ->_fsave_allowed ) imagegif ( $img , $filename ) ;
imagegif ( $img ) ;
>

private function _png_save ( $img , $filename = false )
<
if ( $filename !== false && $this ->_fsave_allowed ) imagepng ( $img , $filename ) ;
imagepng ( $img ) ;
>

Не совсем понял про ориентацию фотоаппарата, но я вижу проблему так:
Картинка может иметь альбомную или портретную ориентацию или быть квадратной. Пусть будет альбомная с размерами 400х300 — это размеры холста, в который помещено изображение такого же размера, т.е. изображение полностью покрывает холст. Функция imagerotate поворачивает изображение, но не трогает холст, поэтому появляются дыры. При повороте на 90 градусов новый размер изображения станет 300х400, а размер холста останется 400х300.

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

Если мы поворачиваем на 90 градусов, то мы должны плясать уже от размеров 300х400 а не 400х300, т.е. перед вычислением размеров нового холста, мы должны поменять местами оригинальные ширину и высоту картинки.

В общем случае, можно принять, что мы всегда будем поворачивать картинку на угол, кратный 90 градусам и передавать в скрипт не величину угла, а количество поворотов.
Передавать, например, параметром r, который будет принимать значения от нуля до трёх. Если r=1, то угол будет равным 90, если r=2, то 180 градусов, и т.д.
Если мы получили нечетное количество поворотов, то мы должны поменять местами значения переменных $orig_width и $orig_height и сделать это сразу после инициализации этих переменных.
Код может быть такой

//
$orig_width = $info [ 0 ] ;
$orig_height = $info [ 1 ] ;
$dst_x = $dst_y = 0 ;

И потом, при повороте указать (см. код из предыдущего поста)

Так же не забыть сделать замену

И убрать первые два добавленных блока )

Ещё надо позаботиться о сохранении файлов на диск, т.е. в имя добавлять значение поворота.

По поводу поворота, то эта информация берется из фотографии стандартной функцией exif_read_data

вот:

//
$exif_data = exif_read_data (www.php.net/exif_read_data) ( $data [ $i ] [ ‘filename’ ] ) ; //

//
$orientation_calc = $exif_data [ ‘Orientation’ ] ;
switch ( $orientation_calc )
<
case 1 : //
$orientation_calc = » » ;
$angle = «0» ;
break ;

case 2 : //
$orientation_calc = » » ;
$angle = «0» ;
break ;

case 3 : //
$orientation_calc = «180 » ;
$angle = «180» ;
break ;

case 4 : //
$orientation_calc = » » ;
$angle = «0» ;
break ;

case 5 : //
$orientation_calc = » + 90 » ;
$angle = «90» ;
break ;

case 6 : //
$orientation_calc = «-90 » ;
$angle = «-90» ;
break ;

case 7 : //
$orientation_calc = » + 90 » ;
$angle = «-90» ;
break ;

case 8 : //
$orientation_calc = «90 » ;
$angle = «90» ;
break ;
>
//

PHPDesigner

Вы здесь: Главная » PHP » Создание эскизов изображений средствами PHP

Создание эскизов изображений средствами PHP

Очень часто возникает необходимость создания превью изображений (так называем ThumbImage). В зависимости от специфики проекта, требуется:

1) осуществлять ресайз изображений “на лету”, непосредственно при загрузке страницы;

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

3) массовый ребилд изображений. Бывает необходим в некоторых случаях, например: каталог товаров формируется с помощью CSV-файла, в котором прописаны пути к оригинальным изображениям. Изображения загружены в специальную папку и от скрипта требуется создать уменьшенные копии оригиналов.

Итак, обзор скриптов и решений.

Smart Image Resizer

Автор: Joe Lencioni

Текущая версия: v1.3.3 (Released April 28, 2008)

Оф.сайт: shiftingpixel.com

Требования:

Описание:

Очень простой в использовании скрипт для ресайза изображений “на лету”.

Работает со следующими графическими форматами: JPEG, GIF, PNG. Достаточно аккуратно обращается с внешним видом картинки – ясность, контраст и т.п. остаются на высоком уровне. Резать старается “по-умному” – предварительно вычислив коэффициент “ширина/высота”. Может заполнять прозрачные области GIF, PNG-изображений заданным цветом. Заботливо складывает отресайзенные изображения в папочку кэша и при наличии кэшированной картинки -выводит именно её, что, конечно же, благоприятно влияет на скорость работы.

Установка:

Скачиваем архив: http://shiftingpixel.com/downloads/image-1.3.3.zip.

Извлекаем файл image.php. В директории со скриптом создаем папку “imagecache”.

Используя, например, вот такой вызов картинки, наслаждаемся полученным результатом:

Название паки кэша можно поменять в самом скрипте. Путь к директории с картинками, как мы видим, задается непосредственно в URL (в “image=” прописан путь до картинки, начиная с корня сайта).

Пример использования в php-скрипте.

ИМХО: простой в использовании скрипт с минимумом возможностей, которых, впрочем, бывает вполне достаточно.

phpThumb()

Автор: James Heinrich

Текущая версия: 1.7.8 (updated: 28-May-2008 )

Оффсайт: http://phpthumb.sourceforge.net

Требования:

Описание:

Как и Smart Image Resizer, данный скрипт использует GD для создания превью “на лету”, но в отличие от предыдущего подопытного обладает огромным количеством возможностей и настроек. Фактически, это класс для работы с изображениями на все случаи жизни.

Поддерживаемые графические форматы входных файлов:

• JPEG;
• PNG;
• GIF;
• BMP;
• при наличии ImageMagick – любой формат, который поддерживается данной библиотекой

Поддерживаемые графические форматы выходных файлов:

• JPEG;
• PNG;
• GIF;
• BMP (при наличии ImageMagick или phpthumb.bmp.php в наборе скриптов);
• ICO (при наличии ImageMagick или phpthumb.ico.php в наборе скриптов)

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

Из особых приятностей: действительно “умная” обрезка изображений, большое количество фильтров для выходных изображений (наложение водяного знака, поворот, тень + множество других).

Огромное количество примеров (демо):

Установка: все также распаковываем архив в какую-либо директорию, папка кэша уже есть в архиве, так что отдельно ее создавать не нужно Возможно, потребуется произвести дополнительную настройку скрипта (например, поправить пути и т.п.) – все зависит от конкретной ситуации использования. Для начала, переименуйте файл “phpThumb.config.php.default” в “phpThumb.config.php” и смотрите уже по результатам отработки скрипта – если в процессе выполнения будут возникать неполадки, скрипт сообщит об этом, показав на месте вывода картинки изображение с текстом ошибки.

Пример использования в php-скрипте.

Пример очень похож на предыдущий. Разница лишь в формировании URL-а изображения и наборе передаваемых параметров

ИМХО: мощный инструмент для работы с изображениями. Работает с максимальным соотношением “возможности/качество/скорость”. Большим плюсом является достаточно полная документация и хороший набор демо-данных (как на оффсайте, так и в архиве со скриптом).

Мы рассмотрели примеры “умных” (в случае phpThumb() – МегаУмных) скриптов, предоставляющих большое число возможностей при работе с изображениями.

Теперь рассмотрим пример “простого” создания превью, но с сохранением результатов ресайза в виде отдельных файлов и организацией набора функций по ресайзу в виде отдельного класса. При необходимости, конечно же, существует возможность использовать те самые “умные” скрипты в составе библиотеки. Но это тема для отдельной беседы).

Простой скрипт ресайза изображений

Постановка задачи:

В таблице с описанием товаров существует поле `product_full_image`, в нем содержаться названия графических файлов.

Сами файлы лежат по адресу “/components/com_virtuemart/shop_image/product/”.

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

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

1. Рисуем форму (мне было удобно сделать это внутри отдельной функции):

После сабмита основной скрипт shop.browse.php отлавливает параметры формы и передает в нижеописанную функцию значения $small_x и $middle_x

2. Функция, в которую приходят выловленные параметры:

В состав функции дополнительно можно включить, например, запись в БД названий полученных эскизов. Также без труда можно использовать приведенный в пример принцип для создания эскизов одного изображения, загружаемого через форму.

Обработка изображений в PHP

Библиотека GD дает возможность работать с изображениями в PHP. Подробнее о функциях на php.net.

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

Открытие изображения

Итак, есть исходное изображение PNG 400x400px:

С помощью функции getimagesize() получим ширину, высоту и тип, далее откроем его функциями в зависимости от типа:

Изменение размера изображения (resize)

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

Результат

Обрезать изображение (crop)

Пример вырезает из исходного изображения часть размером $w на $h .
$x и $y задают начальные координаты в пикселях или процентах.

Результат

Поворот изображения

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

Поворот на не ровный угол увеличит ширину и высоту фото:

Зеркальное отражение

Imageflip() зеркалит изображение, могут быть следующие параметры:

Наложение водяного знака (watermark)

Для защиты на картинки наносят копирайт, например, данный скрип накладывает картинку watermark.png на основное изображение:

Результат

Добавление фона

Актуально для PNG с прозрачностью. Скрипт вставит на задний фон картинку с положением $x и $y . Размер основного изображения не изменится.

Фильтры

Функция imagefilter() применяет фильтр к изображению.
В параметре $filtertype указывается константа применяемого фильтра, а в следующих его настройки.

IMG_FILTER_NEGATE

Инвертирует цвета изображения.

IMG_FILTER_GRAYSCALE

Преобразует цвета изображения в градации серого.

IMG_FILTER_COLORIZE

Преобразует цвета изображения в градации заданного цвета в формате RGB.

IMG_FILTER_BRIGHTNESS

Изменяет яркость изображения, диапазон от -255 до 255.

IMG_FILTER_CONTRAST

Изменяет контрастность изображения. Уровень может быть от -100 до 100.

IMG_FILTER_EDGEDETECT

Использует определение границ для их подсветки.

Можно ли вывести превью загружаемой картинки?

Можно как то вывести превью загружаемой картинки ? Миниатюру, где красный квадра.

1 ответ 1

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

Всё ещё ищете ответ? Посмотрите другие вопросы с метками php изображения upload или задайте свой вопрос.

Похожие

Подписаться на ленту

Для подписки на ленту скопируйте и вставьте эту ссылку в вашу программу для чтения RSS.

дизайн сайта / логотип © 2020 Stack Exchange Inc; пользовательское содержимое попадает под действие лицензии cc by-sa 4.0 с указанием ссылки на источник. rev 2020.11.11.35402

KREMER.PRO | Блог

Заметки front-end программиста

Создание превьюшек в PHP

Создать экскиз-превью по изображению в PHP – задача тривиальная, необходимо только воспользоваться встроенными функциями imagecopyresampled() и imagejpeg() .

Однако есть две вещи, которые хочется улучшить в этом процессе:

1. Сделать изображение квадратным, обрезав лишнее слева и справа или сверху и снизу в равных количествах в случае, если изображение вытянуто в ширину, либо в высоту, соответственно.
2. Зашарпить изображение.

Очень просто всё сделать становится с помощью этого класса:

Превью картинки на PHP

Здесь могла бы быть ваша реклама

Покинул форум
Сообщений всего: 4574
Дата рег-ции: Июль 2006
Откуда: Israel

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

Само собой я знаю что ответят мне тут же, и если я посмотрю
на сообщения на форуме, то пойму что в общем то я и не ошибаюсь.
Но еще я точно замечу, что очень мало тем, в которых всего два ответа :
вопрос автора и еще два сообщение вида Ответ + Спасибо

После этого приходится начинать уточнять этим неграмотным что мне надо.
Они что, сами читать не умеют? А уточнять приходится.
И иногда пока они переварят то что я им скажу проходит и не одна ночь..

Уверен что если бы я им сказал что у меня есть
фиолетовый квадрат, и нужно превратить его в синий треугольник
и я пытался взять кисточку, макнуть в банку и поводить ей по квадрату
но почему то кисточка не принимала цвет краски в банке,
то на мой вопрос — где взять правильные банки мне бы ответили гораздо быстрее
предложив её открыть, а не тратить еще стольник на жестянку.

Поэтому с тех пор я строю свои вопросы по проверенной давным давно схеме:
Что есть
Что нужно получить
Как я пытался
Почему или что у меня не получилось.

На последок как оно происходит на форумах

Новичок: Подскажите пожалуста самый крепкий сорт дерева! Весь инет перерыл, поиском пользовался!
Старожил: Объясни, зачем тебе понадобилось дерево? Сейчас оно в строительстве практически не используется.
Новичок: Я небоскрёб собираюсь строить. Хочу узнать, из какого дерева делать перекрытия между этажами!
Старожил: Какое дерево? Ты вообще соображаешь, что говоришь?
Новичок: Чем мне нравиться этот форум — из двух ответов ниодного конкретного. Одни вопросы неподелу!
Старожил: Не нравится — тебя здесь никто не держит. Но если ты не соображаешь, что из дерева небоскрёбы не строят, то лучше бы тебе сначала школу закончить.
Новичок: Не знаите — лучше молчите! У меня дедушка в деревянном доме живёт! У НЕГО НИЧЕГО НЕ ЛОМАЕТСЯ.
Но у него дом из сосны, а я понимаю, что для небоскрёба нужно дерево прочнее! Поэтому и спрашиваю. А от вас нормального ответа недождёшся.
Прохожий: Самое крепкое дерево — дуб. Вот тебе технология вымачивания дуба в солёной воде, она придаёт дубу особую прочность:
Новичок: Спасибо, братан! То что нужно.

Отредактировано модератором: Uchkuma, 26 Апреля, 2011 — 10:21:12

Миниатюры на PHP

Статья написана для интернет-издания Hostinfo.ru.

В ходе разработки и обслуживания сайтов часто возникает необходимость в создании миниатюр — уменьшенных копий изображений. В тексте страницы вместо большой картинки можно поместить такую копию, являющуюся ссылкой на исходный файл. Работа фотоальбомов и галерей изображений, менеджеров файлов в CMS немыслима без автоматического создания миниатюр. Мы разберем скрипт, генерирующий подобные миниатюры, и на его примере познакомимся с некоторыми возможностями PHP для работы с изображениями.

PHP обрабатывает изображения с помощью библиотеки GD. Почти на всех хостинговых площадках эта библиотека установлена. Если вдруг вам не повезло, обратитесь в техническую поддержку вашего хостинга. В нашем скрипте будем использовать функции, появившиеся в библиотеке GD версии 2.0.1.

Сначала определим требования, которым будет отвечать генератор миниатюр. Он должен создавать уменьшенные копии изображений, сохраненных в форматах GIF, JPEG и PNG. Если исходное изображение обладало прозрачностью, то и миниатюра должна сохранять прозрачность. Также не следует пренебрегать безопасностью и быстродействием.

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

Для указания размера миниатюры предусмотрим два способа. Можно задать параметр max_size , тогда размеры изображения на выходе будут пропорциональны исходным, но изменятся так, что его можно будет вписать в квадрат размером max_size*max_size . Можно также задавать размер изображения на выходе напрямую в параметрах width и height (при отсутствии одного из них картинка будет сжата пропорционально).

Договоримся, что скрипт будет генерировать миниатюры для файлов, расположенных в корневой директории веб-сервера или в поддиректориях. Для предотвращения несанкционированного доступа к другим файлам условимся, что параметр file в URL задает путь к файлу от корневой директории и начинается со знака ‘/’ .

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

Для начала получим информацию об исходном изображении:

Функция getimagesize возвращает массив $image_info , содержащий значения некоторых характеристик изображения:

• $image_info[0] и $image_info[1] — это ширина и высота изображения,
• $image_info[2] — константа вида IMAGETYPE_XXX , определяющая формат файла (например, IMAGETYPE_GIF или IMAGETYPE_JPEG ),
• $image_info[3] — строка ‘height=»yyy» w ‘ , предназначенная для вставки в тег
• $image_info[‘mime’] — mime-тип, соответствующий файлу.

В зависимости от mime-типа мы будем вызывать свою функцию для открытия и загрузки изображения: imagecreatefromGIF , imagecreatefromJPEG или imagecreatefromPNG .

Теперь нужно определить размеры миниатюры, если они не заданы явно.

Функция imagecreatetruecolor создает полноцветное изображение указанного в параметрах размера и возвращает его идентификатор. imagealphablending позволяет выбрать один из двух способов работы с альфа-каналом. Если второй параметр этой функции установлен в true, то при рисовании полупрозрачным цветом новое изображение частично накладывается на старое. Если же он установлен в false, то происходит полное замещение пикселей исходного изображения на пиксели нового. Ясно, что нам нужен именно второй режим. Функция imagesavealpha необходима для того, чтобы при вызове функции imagePNG альфа-канал был сохранен в результирующее изображение.

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

Следует отметить, что есть и другая функция, imagecopyresized , которая похожа на imagecopyresampled . Качество картинки, созданной imagecopyresized , трудно признать удовлетворительным, поскольку эта функция не производит сглаживание, но она работает быстрее. Поэтому в некоторых ситуациях вполне допустимо ее использовать.

Так как мы хотим сохранить прозрачность исходного изображения, миниатюру приходится сохранять в формате PNG. Функция imagePNG выводит в браузер изображение с указанным идентификатором.

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

мы получим работоспособный скрипт.

Следует отметить, что функция header устанавливает заголовки ответа сервера, и в данном случае она указывает на тип (картинка PNG) возвращаемых данных. Заголовок Content-Type , как и любые заголовки, необходимо устанавливать до операций вывода. Однако при работе с графикой устанавливать этот заголовок нужно как можно ниже, так как сообщения об ошибках, появляющихся после установки Content-Type: image/png не будут выводиться в браузер.

Посмотрим на написанный код. Каждый раз при обращении к странице с миниатюрами сервер создает их заново, что при большой посещаемости сайта приведет к значительной нагрузке на сервер. Обычным выходом в данной ситуации является кеширование — сохранение результатов работы скрипта в файлы.

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

Рассмотрим, как можно сделать кеширование миниатюр. Мы будем сохранять их в файлы с именами, являющимися md5-хешами имен файлов с исходными изображениями, например, в папку img_cache в корневой директории веб-сервера.

Определим время изменения файла с кешем, если он существует.

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

Наша функция make_thumbnail сразу отправляет миниатюру браузеру. Однако предварительно нужно сохранить миниатюру в кеш. Поэтому мы не должны вызывать функцию make_thumbnail непосредственно, так, как сделали это выше. Нужно перехватить вывод с помощью буферизации. После выполнения участка кода между ob_start и ob_end_clean в переменной $thumbnail будут содержаться те данные, которые функция imagePNG собиралась отправить браузеру, а в переменной $thumb_size — размер данных.

Стоит отметить, что в директории img_cache будут оставаться уменьшенные копии удаленных картинок. Поэтому при масштабном изменении структуры сайта кеш нужно очищать вручную.

Осталось установить заголовки и отправить миниатюру браузеру.

Теперь нужно собрать участки кода в один файл, например, preview.php (разместив функцию make_thumbnail в начале) и поместить его в корневую директорию веб-сервера. Там же нужно создать директорию img_cache и установить права доступа к ней в 777. Всё готово!

Пусть изображение pict.jpg лежит в директории images, то есть его можно вставить на страницу с помощью кода . Тогда код, помещающий миниатюру, примет вид .

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

Превью картинки на PHP

Данный класс позволяет на лету:
1) Изменять размер изображения задавая максимальную высоту и ширину.
2) Изменять размер изображения указывая %
3) Резать изображения от центральной точки
4) Резать изображения от заданной точки
5) Поворачивать изображение

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

Где d_docsm/create.php путь к изображению меняющему размер

//reference thumbnail class
include_once(‘thumbnail.inc.php’);
$size = 120;//$_GET[‘size’];
$albumName = ‘files’;//$_GET[‘albumname’];
$fileName = $_GET[‘file’];

//$thumb = new Thumbnail(‘../albums/’ . $albumName . ‘/’ . $fileName);
$thumb = new Thumbnail($fileName);
chdir($backup_dir);
/*ресайзим изображение, здесь же можно применять другие функции изменения изображения
они описаны в файле thumbnail.inc.php*/
$thumb->resize($size, $size);

файлы thumbnail.inc.php, create.php и папка thumbs должны лежать в одной директории.

Файлы Thumbs.rar ( 4,77 KB ) Кол-во скачиваний: 53

Источник неизвестен
Автор: Ian Selby (ian@gen-x-design.com)

Отредактировано: ralfNV — 7 Марта 2010, 13:43

Возраст: скрывает
Регистрация: 26.11.2003

Email: lev_92.23@mail.ru · Skype: Lev_Veron · Email: support@cyberstyle.kz
Портфолио: www.coding-plus.com

Искал урок но не нашел. Пишу сюда, сильно не браните, если не по теме!

Тема така. У мну есть массив. Он состоит из трех полей: адрес к картинке, название к картинке, и id. Массив имеет неогранниченное количество картинок!

Вопрос. Как прописать PHP, чтоб программа выводила все картинки с названием из массива по 4е шт. в строке. Т.е. имеет место цикл, о выводе всех картинок, но через каждую 4, 8, 12, 16, 20 и т.д. картинку необходимо выводить тег
.

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

Работа с изображениями на PHP

Уважаемые участники проекта ДвижКод! Сегодня вас ждёт еще одна интересная тема. Все мы привыкли, скажем, загружать новые аватарки в социальных сетях. Но как они масштабируются до нужных размеров? Что происходит на сервере? На эти и многие другие вопросы ответы вас ждут под катом.

Да, если кто не в курсе, то в интернет-терминологии «кат» (от англ. cut — резать), это место, которое разделяет новость на краткое (в общем списке) и полное представления.

Многие знают, что я разрабатываю собственную систему управления сайтами под названием Когир (Cogear, http://cogear.ru). История сложная и длинная, но упорно иду к поставленной цели.

Недавно мне пришлось переписывать ранее написанные классы для работы с изображениями, поэтому я решил с вами поделиться тем, как всё это делается. Милости прошу на кухню.

Давайте посмотрим базовые аспекты работы с изображениями.

В PHP есть встроенная библиотека GD. Вот её документация:

На этой странице вы найдете огромное количество самых разных функций. Но не пугайтесь. Нас интересуют вполне конкретные.

Как видите, работа с изображениями пока что происходит в виде процедур (функций), поэтому объектно-ориентированную оболочку приходится писать самому.

Простейший пример работы с изображением:

Пробуем на локальной машине.

Создаём файл image.php(у меня для экспериментов локальный домен test.local).

Кладём в корень папки сайта test.local картинку 1.jpg:

Вызываем в браузере http://test.local/image.php (в вашем случае — другой адрес).

Обнаруживаем в папке картинку 2.jpg:

Пропорции не сохранились, как видите. Потому что мы их не пересчитали.

Исправим наш скрипт так, чтобы происходил пересчёт:

Посмотрим на результат:

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

Что еще можно делать с изображением? Подрезать его, поворачивать, наслаивать одно на другое, рисовать на нём.

Уверен, что вам будет интересен мой класс для работы с изображениями. Он вне системы не работает, так как является драйвером для шестерёнки (модуля) «Изображения».

Но вы найдете в нём для себя много интересного:

Как он работает в системе? Ради чего столько кода?

Понимаете? Работает со всеми нужными форматами автоматически. Функционал при необходимости можно расширять.

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

Поделиться

Комментарии Правила дискуссии

1. Участники дискуссии уважительно относятся друг к другу и к автору блога.
2. Мат недопустим. Учитесь вести диалог культурно.
3. Реклама и спам запрещены.

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

Во всем остальном вам предоставляется полная свобода слова и выражения собственного мнения.

Превью картинки на PHP

Созданные страницы должны выводиться плиткой, с показом картинки от видео, причем, со своего сервера — чтобы не ждать ответа от удалённого. Задача осложняется тем, что существует минимум 8 вариантов указания ссылок на эти 3 сервиса: Это всё ссылки на один и тот же клип Rammstein — Mein Herz brennt (Piano Version). Не стоит забывать еще и про юзеров, которые обязательно вставят в форму «ссылку для блога», то есть — прям тег iframe со всеми свойствами, который отдаст сервис.

Вот исходный код моего класса, пользуйтесь на здоровье. Он абсолютно самодостаточен и не завязан на MODX, требуется только cUrl.

В ответ приходит массив содержащий или ключ error с ошибкой, или ключи со ссылками image и video. Если картинку достать не получается — будет подставлен дефолтный url. Все ссылки на видео-хостинги приводятся к единому виду.

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

Пример использования: Отправите ссылку через $_GET и в ответ получите массив с результатом и картинку в указанной директории.

Обновлено 17.08.13

09 декабря 2012, 08:44 Василий Наумкин 20354

Комментарии ( )

Вот варианты ссылок, которые я нашел для YouTube.

Регулярка простая: Но у меня по проекту условие, что один урл в одной строке, поэтому где-то может не работать.

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

Не понятно, что делает этот сниппет? Зачем он и выставляет плейсхолдеры, и возвращает url картинки\видео?

У меня, например, через форму отправлялся урл, для него получалась картинка и сохранялась на сервер, записывая свой адрес в ТВ ресурса. Ну а потом уже обычный вывод страниц, через getResources, с этими картинками.

А тут какая задача?

У меня задача: есть раздел с мастерклассами, они в частности состоят из видео и тестового описания. Т.е. надо выводить видео с ютубы на самой странице и картинку в анонсе, для завлекухи.
Сниппет я обозвал getVideo, он из TV получает ссылку на ютубное видео.
Сниппет сохраняет резултаты в плейсхолдеры, что бы удобнее было на странице/в шаблоне пользоваться этими результатами.
В разделе выводится листинг анонсов. При этом случился трабл: почему то при вызове сниппета в чанке анонса картинка выставлялась только для первого анонса, а для всех последующих — назначалась картинка последнего поста. Т.е. плейсхолдеры закешировались, хотя я и вызывал плейсхолдер некешируемо — [[!+v.image]] и сам сниппет тоже [[!getV > Потому я сделал так, что бы сниппет мог возращать требуемое значение, а не сохранять его в плейсхолдер. Теперь вызов в чанке делается так: и всё заработало.

Выходит, у тебя каждый раз запускается сниппет, обрабатывает ссылку и потом клиент тянет картинку с youtube?

При том, что сниппет, на самом деле, сохраняет эти картинки на твой сервер. В общем, я бы добавил ТВ studioImage и переделал так:

Пишем сниппет, getImage:

Таким образом, класс videoThumb инициализируется только раз и сниппет запускается только на те записи, у которых нет ТВ с картинкой. Ну а картинки потом получаются с твоего сервера. Так быстрее и логичнее.

Писал в браузере, не проверял — могут быть опечатки.

Вам также может быть интересно

Обучение программированию

Я загружаю timagelist динамически как сделать картинки из timagelist прозрачными

Я загружаю timagelist динамически как сделать картинки из timagelist прозрачными? Элемент управления ImageList содержит

Обучение программированию

Язык преобразований xsl (xslt)

Введение в XSLT XSLT представляет собой способ для XML-документов в другие XML или документы

Обучение программированию

Является ли указанная страница — домашней (IE)

Является ли указанная страница — домашней? (IE) При создании новой вкладки (about:Tabs) в IE9

Обучение программированию

Язык преобразований XSLT

Справочник по интерфейсу администратора Ссылки Назад «> Вверх Вперед Опубликованные SQL View > XSLT

Обучение программированию

Ядро и процессы

Что такое ядро в биологии? Строение и функции ядра В каждой живой клетке протекает

Обучение программированию

Язык программирования alfa

Язык программирования alfa По питанию контроллеры делятся на два типа: с питанием 220 В

Обучение программированию

Язык cc

C++ — Базовый синтаксис Когда мы рассматриваем программу на C ++, ее можно определить

Обучение программированию

Язык рефал

Язык рефал Ура! Сегодня, 30.05.2005, наконец появилась адаптированная к современным платформам Windows-(95/98/ME/NT/2000/XP) и UNIX

Обучение программированию

Эффект pазвивающегося флага

Scrontch’s Flag Designer Design Your Flag! Generates Scalable Vector Graphics (SVG). This App requires

Обучение программированию

Язык sql

SQL-Урок 1. Язык SQL. Основные понятия. Для того, чтобы начать изучать SQL нам нужно

Обучение программированию

Язык с

C++ с нуля Этот самоучитель создан для тех, кто хочет освоить основы программирования на

Обучение программированию

Эффект горящей надписи

Простой огненный текст в Фотошопе Конечный результат: Ресурсы урока: Шаг 1 Создайте новый документ

Обучение программированию

Язык xml documents type definitions (dtd)

Язык XML — практическое введение . Documents Type Definitions (DTD) В XML- документах DTD

Обучение программированию

Языки и грамматики простейший компилятор

ГРАММАТИКА ЯЗЫКОВ ПРОГРАММИРОВАНИЯ Описанию грамматики языка предшествует описание его алфавита. Алфавит любого языка состоит

Обучение программированию

Эффект ледяной надписи

Ледяной текст в Фотошопе Конечный результат: Ресурсы урока: 1. Создание фона Шаг 1 Создайте

Обучение программированию

Язык xml dom совместимые анализаторы

XML-анализаторы в java XML как набор байт в памяти, запись в базе или текстовый

Обучение программированию

Языки описания пользовательских интерфейсов

Языки описания пользовательских интерфейсов Язык описания интерфейсов Язык описания интерфейсов (IDL), используемый OMG определяет

Обучение программированию

Эффект линзы (watcom c)

Эффект линзы (watcom c) Просветляющие покрытия от ZEISS Высококачественные линзы требуют высоколассного подхода: защита,

Обучение программированию

Язык xml xml в microsoft internet explorer 5 0

Основы XML для начинающих пользователей Введение в правильную разметку XML означает Extensible Markup Language,

Обучение программированию

Языки программирования

Языки программирования Язык программирования — искусственный (формальный) язык, предназначенный для записи программ для исполнителя

Обучение программированию

Эффект пламени

По-настоящему яркие ролики: эффект огня для видеомонтажа Как поразить зрителей с первых кадров? Самый

Обучение программированию

Язык xml введение

Язык xml введение XML технологии и средства разработки Gupta Team Developer: XML технологии (Часть

Обучение программированию

Якоря HTML

Что такое ссылка якорь в HTML и как ее сделать? Когда мы имеем дело

Обучение программированию

Эффект разбитого текста

Создаем эффект разрушающегося текста при помощи Stipplism В сегодняшнем уроке мы создадим эффект разрушающегося