Laravelの画像編集ライブラリで有名なIntervention Imageを使ったTIPSです。
四角い画像を読み込んで、丸く切り出す方法を解説します。
CSS的にいうと、radiusあたりの操作といった感じでしょうか。
先にコードを記述してしまうと、下記のような感じです。
$profileImage = Image::make($user->image_path); $width = 200; $height = 200; $profileImage->widen($width); $profileImage->heighten($height); $mask = Image::canvas(200, 200); $mask->circle($width, $width/2, $height/2, function ($draw) { $draw->background('#fff'); }); $profileImage->mask($mask, false); $profileImage->save($path."circled.png");
簡単に解説していきます。
$profileImage = Image::make($user->image_path);
Image::make($user->image_path);
ここで、画像を読み込んでおります。
私の場合は、 $user->image_path ここはAWS S3上UPした画像URLです。
https://oshimen-storage.s3.ap-northeast-1.amazonaws.com/XXXXXXXXXXXXXXXXXXXX
というやつですね。
$width = 200;
$height = 200;
$profileImage->widen($width);
$profileImage->heighten($height);
画像サイズを矯正しております。
$mask = Image::canvas(200, 200); $mask->circle($width, $width/2, $height/2, function ($draw) { $draw->background('#fff'); }); $profileImage->mask($mask, false);
maskを作成しております。
maskと同じ直径のサイズの円を作成して、画像を切り出しております。