Справочник функций

Ваш аккаунт

Войти через: 
Забыли пароль?
Регистрация
Информацию о новых материалах можно получать и без регистрации:

Почтовая рассылка

Подписчиков: -1
Последний выпуск: 19.06.2015

Ресайз изображения

3.9K
29 августа 2007 года
АКМ
49 / / 07.06.2005
Как реализовать изменение размеров изображения "на лету"? Ситуация - на страничке есть маленькая картинка и ряд ссылок для просмотра - 200х200, 300х300, 400х400. Надо сделать, чтобы по нажатии на ссылку открывалось новое окно с изображением соответствующего размера. Исходное изображение хранится на сервере и не изменяется.
РНР5, GD2, Apache2.2.
4
29 августа 2007 года
mike
3.7K / / 01.10.2002
Создавай изображения всех размеров в фоновом режиме или во время закачки на сервер, иначе сервер умрет от нагрузки.

Это я как владелец фото-хостинга говорю.
1.8K
29 августа 2007 года
Ghirik
260 / / 15.03.2007
Пропишите в каждой ссылке событие onClick, вот так:
[HTML]
<a href=# onClick="img.style.width='200';img.style.height='200'">jhgjhg</a>[/HTML]
где img - id вашего рисунка


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

Прошу прощения , сейчас покажу как в новом окне открывать..
251
29 августа 2007 года
SkyMаn
1.7K / / 31.07.2007
Цитата: Ghirik
Пропишите в каждой ссылке событие onClick, вот так:
[html]
<a href=# onClick="img.style.width='200';img.style.height='200'">jhgjhg</a>[/html]
где img - id вашего рисунка


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

Прошу прощения , сейчас покажу как в новом окне открывать..


Нет, ну это нелогично. Веди приходится грузить изображения того же размера. А сам ресайз уже на стороне клиента. Лучше обращаться к РНР коду, который будет генерить нужный размер.

1.8K
29 августа 2007 года
Ghirik
260 / / 15.03.2007
Да, совершенно верно, меня сын от компьютера выгоняет, тороплюсь.:)
Вот простое решение:
http://www.maaking.com/index.php?loadpage=scripts
92
29 августа 2007 года
Тень Пса
2.2K / / 19.10.2006
mike правду говорит ) лучше создавать все thumbnail'ы сразу, при upload'е на сервер... а то на лету, да 100 картинок да на Х пользователей )) в общем серв загнётся :)

PS: подтверждаю, как только что закончивший скрипт Free Image Hosting'а :))))
15
29 августа 2007 года
shaelf
2.7K / / 04.05.2005
Сейчас ещё и mfender своё слово скажет))))
От себя только добавлю, не 200 * 200, а 200 по максимальной стороне, а то такое получится))
3.9K
29 августа 2007 года
АКМ
49 / / 07.06.2005
Цитата: mike
Создавай изображения всех размеров в фоновом режиме или во время закачки на сервер, иначе сервер умрет от нагрузки.

Это я как владелец фото-хостинга говорю.



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

3.9K
29 августа 2007 года
АКМ
49 / / 07.06.2005
Цитата: Ghirik
Да, совершенно верно, меня сын от компьютера выгоняет, тороплюсь.:)
Вот простое решение:
http://www.maaking.com/index.php?loadpage=scripts



спасибо, посмотрим..

8
29 августа 2007 года
mfender
3.5K / / 15.06.2005
Цитата: shaelf
Сейчас ещё и mfender своё слово скажет))))


А что тут сказать?
Если нагрузка на сервер большая - делать несколько картинок разноразмерных и хранить их все.
Если не большая - можно на лету делать.

У меня всё на лету. Нагрузка не большая.

Ещё следует учитывать вариации дизайна: сегодня нужно 200 точек, а завтра - 220. А картинок уже сто тысяч. Потребуется время на переделку. Хотя это и не критично.

15
29 августа 2007 года
shaelf
2.7K / / 04.05.2005
Время на переделку - 5 минут))
Меняется размер в скрипте/конфиге, и в цикле пробегается по папке с "истинным размером".
8
29 августа 2007 года
mfender
3.5K / / 15.06.2005
Цитата: shaelf
Время на переделку - 5 минут))
Меняется размер в скрипте/конфиге, и в цикле пробегается по папке с "истинным размером".


я и написал, что это не критично ))))

1.8K
29 августа 2007 года
Ghirik
260 / / 15.03.2007
Парни, вот посмотрите, два варианта ресайза, из приведенной ранее ссылки и ещё один (нарыл когда то в Инете).
Из ссылки:
[HTML]
<!doctype html public "-//w3c//dtd html 4.01 transitional//en">
<html>
<head>
<title> .: Maaking.Com :. Upload and Resize Images</title>
<?php
########################################
# Upload and Resize Images #
# with Aspect Ratio #
# By: Mohammed Ahmed #
# Gaza, Palestine #
# Email: m@maaking.com #
# Skype: maaking #
# Date: 16-May-2006 #
########################################

//load the config file
include("config.php");

//if the for has submittedd
if (isset($_POST['upForm'])){

$file_type = $_FILES['imgfile']['type'];
$file_name = $_FILES['imgfile']['name'];
$file_size = $_FILES['imgfile']['size'];
$file_tmp = $_FILES['imgfile']['tmp_name'];

//check if you have selected a file.
if(!is_uploaded_file($file_tmp)){
echo "Error: Please select a file to upload!. <br>--<a href=\"$_SERVER[PHP_SELF]\">back</a>";
exit(); //exit the script and don't do anything else.
}
//check file extension
$ext = strrchr($file_name,'.');
$ext = strtolower($ext);
if (($extlimit == "yes") && (!in_array($ext,$limitedext))) {
echo "Wrong file extension. <br>--<a href=\"$_SERVER[PHP_SELF]\">back</a>";
exit();
}
//get the file extension.
$getExt = explode ('.', $file_name);
$file_ext = $getExt[count($getExt)-1];

//create a random file name
$rand_name = md5(time());
$rand_name= rand(0,999999999);
//get the new width variable.
$ThumbWidth = $img_thumb_width;

//keep image type
if($file_size){
if($file_type == "image/pjpeg" || $file_type == "image/jpeg"){
$new_img = imagecreatefromjpeg($file_tmp);
}elseif($file_type == "image/x-png" || $file_type == "image/png"){
$new_img = imagecreatefrompng($file_tmp);
}elseif($file_type == "image/gif"){
$new_img = imagecreatefromgif($file_tmp);
}
//list width and height and keep height ratio.
list($width, $height) = getimagesize($file_tmp);
$imgratio=$width/$height;
if ($imgratio>1){
$newwidth = $ThumbWidth;
$newheight = $ThumbWidth/$imgratio;
}else{
$newheight = $ThumbWidth;
$newwidth = $ThumbWidth*$imgratio;
}
//function for resize image.
if (function_exists(imagecreatetruecolor)){
$resized_img = imagecreatetruecolor($newwidth,$newheight);
}else{
die("Error: Please make sure you have GD library ver 2+");
}
imagecopyresized($resized_img, $new_img, 0, 0, 0, 0, $newwidth, $newheight, $width, $height);
//save image
ImageJpeg ($resized_img,"$path_thumbs/$rand_name.$file_ext");
ImageDestroy ($resized_img);
ImageDestroy ($new_img);
//print message
echo "<br>Image Thumb: <a href=\"$path_thumbs/$rand_name.$file_ext\">$path_thumbs/$rand_name.$file_ext</a>";
}

//upload the big image
move_uploaded_file ($file_tmp, "$path_big/$rand_name.$file_ext");

echo "<br>Image Big: <a href=\"$path_big/$rand_name.$file_ext\">$path_big/$rand_name.$file_ext</a>";

echo "<br><br>--<a href=\"$_SERVER[PHP_SELF]\">back</a>";

}else{ //if the form hasn't been submitted.

//print the form
echo "<script>
function view_img(img_name){
document[img_name].src = upForm.imgfile.value;
document[img_name].width = 150;
}
</script>\n\n
<br><h3>:: Browse an Image to Upload:</h3>\n
<form method=\"post\" name=\"upForm\" enctype=\"multipart/form-data\" action=\"$_SERVER[PHP_SELF]\">\n
<input type=\"file\" name=\"imgfile\" onchange=\"java script:view_img('img_vv');\"> <img src='' name='img_vv' width='0'><br>\n
Image width will resize to <b>$img_thumb_width</b> with height ratio.
<br><input type=\"Submit\" name=\"upForm\" value=\"Upload & Resize\">\n
</form>
<a href=\"view_gallery.php\">View Images</a>";

}


//print copyright ;)
echo"<p align=\"right\"><br>Script by: <a href=\"http://www.maaking.com\">maaking.com</a></p>
</body>
</html>";

?>
[/HTML]
Ещё один:
[HTML]
<?
/* попытка создания класса
*задачи:
*-создать эскиз в каталоге $ThumbDir
* с высотой $ThumbHeight и пропорциональной шириной
*-закачать изображение в каталог $GaleryDir
*
*пример употребления в пищу:
* include ($_SERVER['DOCUMENT_ROOT']."/classes/galery.class");
* $nGalery = new Galery;
* $nGalery->GaleryDir=$GALERY_DIR;
* $nGalery->ThumbDir=$THUMBS_DIR;
* $nGalery->ThumbHeight = 150;//задаем высоту эскизов
* $nGalery->UploadName=time()-1104516000; //делаем названия файлов уникальными (тупо, но по другому пока не придумал)
* $nGalery->Image=($_FILES['image']['tmp_name']);
* $about_image=$nGalery->CheckImgType(); //выбираем данные об изображении для дальнейшей работы

*/
class Galery
{
var $GaleryDir; //путь на диске к файлам изображений (что-то типа getenv("DOCUMENT_ROOT").'/usrfiles/galery/')
var $GaleryURL; //путь для браузера к тем же файлам (например '/usrfiles/galery/')
var $ThumbDir; //путь к превьюшкам (предполагается вроде $GaleryDir.'thumbs' )
var $ThumbURL; //понятно что
var $ThumbHeight;// высота превьюшек (захотелось вот их по высоте выравнивать;-))
var $Image; //
var $UploadName;

function CheckImgType() //проверка соответствия изображения моим требованиям + инфа о нем для дальнейшего применения
{
$imgtype = @getimagesize($this->Image);
$image_w = $imgtype[0];
$image_h = $imgtype[1];
switch($imgtype[2])
{
case 1:
$image_type= "GIF";
$image_ext = ".gif";
$image_crt = imagecreatefromgif($this->Image);
break;

case 2:
$image_type= "JPEG";
$image_ext = ".jpg";
$image_crt = imagecreatefromjpeg($this->Image);
break;

case 3:
$image_type= "PNG";
$image_ext = ".png";
$image_crt = imagecreatefrompng($this->Image);
break;

case 6:
$image_type= "BMP";
$image_ext = ".bmp";
$image_crt = imagecreatefromwbmp($this->Image);
break;

default:
$image_err = "изображения могут быть только в формате GIF, JPEG, PNG или BMP";
}
if(!$image_err)
{
return array("type"=>$image_type,"ext"=>$image_ext,"create"=>$image_crt,"width"=>$image_w,"height"=>$image_h);
}
else
{
return array("error"=>$image_err);
}
}

function CreateThumb() //сия функция создает собственно превью
{
$check_img=$this->CheckImgType();
if($check_img['type'])
{
$final_thumb_name = $this->ThumbDir.$this->UploadName.".jpg"; //сделаем их всех JPEG-ами , чтоб не напрягаться
$width = imagesx($check_img['create']); //ширина оригинала
$height = imagesy($check_img['create']); //высота оригинала
$thumb_width = ($this->ThumbHeight * $width) / $height;
$thumb = imagecreatetruecolor($thumb_width, $this->ThumbHeight);
imagecopyresampled($thumb,$check_img['create'],0,0,0,0,$thumb_width,$this->ThumbHeight,$width,$height);
imageJPEG($thumb, $final_thumb_name);
imagedestroy($check_img['create']);
}
}


function UploadImg()
{
$this->CreateThumb();
if(is_uploaded_file($this->Image))
{
$about_image=$this->CheckImgType();
move_uploaded_file($this->Image,$this->GaleryDir.$this->UploadName.$about_image['ext']);
}
}
function ViewImage()
{

}
}
?>
[/HTML]

Скрипты оба нравятся, но во втором варианте меня прильщает, что все картинки при загрузке делаются jpg и красиво форматирован.:)
В котором скрипте лучше (качественней) обработка изображений?
1.8K
30 августа 2007 года
Ghirik
260 / / 15.03.2007
Ну что? Есть здесь php программисты.
Выскажитесь по коду, не проходите мимо.
251
30 августа 2007 года
SkyMаn
1.7K / / 31.07.2007
Цитата: Ghirik
Ну что? Есть здесь php программисты.
Выскажитесь по коду, не проходите мимо.


Работает? Вот и хорошо, юзай его.:p Сам класс вроде неплохой

1.8K
30 августа 2007 года
Ghirik
260 / / 15.03.2007
Дак здесь два скрипта, какой лучше юзать?

Я буду встраивать один из этих скриптов в свою задачу, вот здорово то будет, не зная, php намучаюсь с встраиванием, а потом окажется что функция устаревшая...

Посотрите хотябы на предмет используемых функций.
251
30 августа 2007 года
SkyMаn
1.7K / / 31.07.2007
Цитата: Ghirik
Дак здесь два скрипта, какой лучше юзать?


Я более предпочтителен к классам. То есть, второй.

1.8K
30 августа 2007 года
Ghirik
260 / / 15.03.2007
А с функциями там всё Ok?
251
30 августа 2007 года
SkyMаn
1.7K / / 31.07.2007
Цитата: Ghirik
А с функциями там всё Ok?


На себе не проверял. Разрешаю это сделать тебе.

1.8K
30 августа 2007 года
Ghirik
260 / / 15.03.2007
Я что то не пойму, Вы не разбераетесь в php?
Я же не прошу Вас код писать!
251
30 августа 2007 года
SkyMаn
1.7K / / 31.07.2007
Цитата: Ghirik
Я что то не пойму, Вы не разбераетесь в php?
Я же не прошу Вас код писать!


"На слабо" тут никого не стоит брать. Лень самому чтоль проверить? За вас это никто не сделает. А во-вторых, код выкладывали именно вы, не зная, рабочий он или нет.

1.8K
30 августа 2007 года
Ghirik
260 / / 15.03.2007
Я действительно не понимаю, если человек владеет языком, почему не посмотреть и не сказать? Я потрачу уйму времени на выяснение. Зачем? У меня нет сейчас в планах изучать php. Готовое прилепить я смогу, с книжкой, но смогу. Мне большего и не надо. Во всяком случае пока.

Но все равно, спасибо. Не отвечайте, я в эту ветку больше на загляну.
92
30 августа 2007 года
Тень Пса
2.2K / / 19.10.2006
смотри-ка ) обиделся )))
нагло с Вашей стороны, Ghirik, такое говорить )

чужое время Вам не жалко, а своё значит жалко :) круть!
3.9K
30 августа 2007 года
АКМ
49 / / 07.06.2005
хорош ругаться))

спасибо, парни, за советы. Изменение изображения при загрузке на сервер я сделал сам. а как, все же, сделать ресайз на лету??
8
31 августа 2007 года
mfender
3.5K / / 15.06.2005
Цитата: АКМ
Изменение изображения при загрузке на сервер я сделал сам. а как, все же, сделать ресайз на лету??


Так же точно. Даже писать меньше, чем "при загрузке на сервер".
А что конкретно в этом случае тебе не понятно?

3.9K
31 августа 2007 года
АКМ
49 / / 07.06.2005
да что писать не понятно. может при переходе по ссылке 400*400 надо создавать временное изображение размерами 400*400 и его выводить, а потом удалять при закрытии страницы?
8
31 августа 2007 года
mfender
3.5K / / 15.06.2005
Цитата: АКМ
да что писать не понятно. может при переходе по ссылке 400*400 надо создавать временное изображение размерами 400*400 и его выводить, а потом удалять при закрытии страницы?


Ну вот смотри.
Есть картинка с адресом http://fishing.kbtour.ru/pspic482thumb
В .htaccess написанно:

RewriteRule ^(.*)pspic([0-9]+)thumb$ $1pspic.php?pic=$2&thumb=yes
RewriteRule ^(.*)pspic([0-9]+)$ $1pspic.php?pic=$2


Адрес обращения к изображению выглядит в первом случае как http://fishing.kbtour.ru/pspic482thumb, во втором - http://fishing.kbtour.ru/pspic482

И, соответственно, сам скрипт с именем pspic.php:

Код:
require_once "includes/setup.inc";

if(isset($_REQUEST['pic']))
{
    $imgfile = PHOTOSESSIONS_PICTURES_DIR.$_REQUEST['pic'].".jpg";
    $pic_sizes = getimagesize($imgfile);

    if(isset($_REQUEST['thumb'])){
        $pic = imagecreatefromjpeg($imgfile);
        $prop = $pic_sizes[0]/$pic_sizes[1];
        if($prop > 1){
            $width = THUMBNAIL_WIDTH;
            $height = THUMBNAIL_WIDTH / $prop;
        }
        elseif ($prop <= 1){
            $width = THUMBNAIL_HEIGHT * $prop;
            $height = THUMBNAIL_HEIGHT;
        }
        $tumb = imagecreatetruecolor($width, $height);

        imagecopyresampled($tumb, $pic, 0, 0, 0, 0, $width, $height, $pic_sizes[0], $pic_sizes[1]);

        imagejpeg($tumb, "", THUMBNAIL_COMPRESSION);
    }
    else{
        $logo = imagecreatefrompng(LOGO_TRANSPARENT);
        $logoSizes = getimagesize(LOGO_TRANSPARENT);
        $pic = imagecreatefromjpeg($imgfile);
        $prop = $pic_sizes[0]/$pic_sizes[1];
        if($pic_sizes[0] > FULL_WIDTH || $pic_sizes[1] > FULL_HEIGHT){
            if($prop > 1){
                $width = FULL_WIDTH;
                $height = FULL_WIDTH / $prop;
            }
            elseif ($prop <= 1){
                $width = FULL_HEIGHT * $prop;
                $height = FULL_HEIGHT;
            }
        }
        else{
            $width = $pic_sizes[0];
            $height = $pic_sizes[1];
        }

        $tumb = imagecreatetruecolor($width, $height);

        imagecopyresampled($tumb, $pic, 0, 0, 0, 0, $width, $height, $pic_sizes[0], $pic_sizes[1]);
        imagecopy($tumb, $logo, $width-$logoSizes[0]-2, $height-$logoSizes[1]-2, 0, 0, $logoSizes[0], $logoSizes[1]);

        imagejpeg($tumb, "", FULL_COMPRESSION);
    }
}
Тут два варианта ресайза - для маленькой и для большой картинки. В файле setup.inc определенны константы. Думаю, дальше разберёшься.


Есть также вариации на тему "передать GET'ом ширину картинки". Например тут: http://fishing.kbtour.ru/pic.php?img=4622,190

Тут ещё всё проще. Параметры разделены запятой. Первый - нумер картинки, который отрезан от имени файла (4622.jpg), второй - требуемая ширина.

Думаю, толкнул в нужном направлении.

PS. Да, извиняюсь, там ещё с наслоением логотипа намешанно.
Реклама на сайте | Обмен ссылками | Ссылки | Экспорт (RSS) | Контакты
Добавить статью | Добавить исходник | Добавить хостинг-провайдера | Добавить сайт в каталог