Вывод широкоформатного изображения на страницу

Question

Я пытаюсь использовать плагин WideImage и загружать в него изображение, изменять его размер, а затем выводить его в следующем виде:

<img class="image" src="image.jpg" />

У меня есть это до сих пор:

<?php
  $image = WideImage::load('image.jpg');
  $resizedImage = $image->resize(150, 150, 'outside')->crop('center', 'middle', 150, 150);
?>

Как вывести изображение с измененным размером, чтобы оно было в форме выше? Помогите!

Answer 1

Проблема заключается в том, что браузер пытается прочитать изображение, как если бы оно было текстовым, а точнее HTML-документом. Чтобы решить эту проблему, я бы создал новый скрипт php для обработки изображений, скажем, image.php, с функцией получения пути к изображению, а также параметров модификации. В конце просто покажите изображение, как вы делали раньше, просто обязательно измените заголовок содержимого на что-то вроде:

 header('Content-type: image/jpg');

или же

header('Content-type: image/png');

При этом браузер будет знать, как интерпретировать полученные данные.

Answer 2

Изменение размера

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

Измените размер изображения в поле 400×300. По умолчанию изменение размера сохраняет соотношение сторон исходного изображения, а полученное изображение соответствует заданным размерам изнутри.

$resized = $image->resize(400, 300);

Это равносильно передаче 'inside' в качестве значения $fit.

$resized = $image->resize(400, 300, 'inside');

Измените размер изображения, чтобы он соответствовал рамке 400×300 извне, передав параметр "outside" в $fit. Это означает, что изображение будет размером не менее 400×300, а соотношение сторон будет сохранено.

$resized = $image->resize(400, 300, 'outside');

Измените размер изображения, чтобы оно точно вписывалось в поле 400×300, передавая "заливка" в качестве значения параметра $fit. Изображение будет растягиваться по мере необходимости, соотношение сторон может не сохраняться.

$resized = $image->resize(400, 300, 'fill');

Четвертый параметр ($scale) определяет, когда масштабировать изображение. Возможные значения включают любые (по умолчанию), вниз и вверх:

down – resize if image is larger than the new dimensions
up – resize if image is smaller than the new dimensions
any – resize regardless of the image size

У метода resize есть два псевдонима: resizeUp и resizeDown. Эти два равны вызову resize() с $scale = 'up' и $scale = 'down' соответственно.

$resized = $image->resize(350, 500, 'inside', 'down');
// is equal to
$resized = $image->resizeDown(350, 500, 'inside');

в вашем HTML добавить

<img src= "<?= $resized ?>"> – Moises Zaragoza just now edit 

Answer 3

Сначала вы должны сохранить изображение с измененным размером в виде файла. В тебе php ставят:

<?php
    $image = WideImage::load('image.jpg');
    $resizedImage = $image->resize(150, 150, 'outside')->crop('center', 'middle', 150, 150);
    $resizedImage ->saveToFile('resized_image.jpg');
?>

Затем сделайте ваше изображение ссылкой на новый файл:

<img class="image" src="resized_image.jpg" />