Image: Is there an option or way to use anti-aliasing when creating circles/masks?

Created on 5 Sep 2014 · 8Comments · Source: Intervention/image

I'm trying to crop a square image to be a circle, but if I create a circle image with background #fff and use it to mask an existing image, the circle's edges are very jagged.

<?php


namespace App\Image\Effects;


use Intervention\Image\Image;

class CropCircle implements Effect{

    /**
     * @param Image $image
     * @param array $options
     * @return mixed
     */
    public function apply(Image $image, array $options = [ ])
    {
        $mask = $this->makeCircleMaskImage($image->width(), $image->height());

        $image = $image->mask($mask);

        return $image;
    }

    /**
     * @param int $width
     * @param int $height
     * @return Image
     */
    private function makeCircleMaskImage($width, $height)
    {
        $circle = \Image::canvas($width, $height, '#000000');

        $circle = $circle->circle($width - 1, $width / 2, $height / 2, function ($draw)
        {
            $draw->background('#ffffff');
        });

        return $circle;
    }
}

missing

Source

samwalshnz

Most helpful comment

Here's a horrible hack I've just done in the mean time. But the more image manipulations I do, the slower it will get. In this one, I create a circle twice the size, then resize it to the normal width/height which will obviously using scaling algorithms to recalculate the pixels, thus effectively kinda anti-aliasing the circle.

<?php


namespace App\Image\Effects;


use Intervention\Image\Image;

class CropCircle implements Effect{

    /**
     * @param Image $image
     * @param array $options
     * @return mixed
     */
    public function apply(Image $image, array $options = [ ])
    {
        $mask = $this->makeCircleMaskImage($image->width(), $image->height());

        $image = $image->mask($mask);

        return $image;
    }

    /**
     * @param int $width
     * @param int $height
     * @return Image
     */
    private function makeCircleMaskImage($width, $height)
    {
        $bigWidth = $width * 2;
        $bigHeight = $height * 2;

        $circle = \Image::canvas($bigWidth, $bigHeight, '#000000');

        $circle = $circle->circle($bigWidth - 1, $bigWidth / 2, $bigHeight / 2, function ($draw)
        {
            $draw->background('#ffffff');
        });

        $circle = $circle->resize($width, $height);

        return $circle;
    }
}

missing-1

samwalshnz on 5 Sep 2014

❤5

All 8 comments

<?php


namespace App\Image\Effects;


use Intervention\Image\Image;

class CropCircle implements Effect{

    /**
     * @param Image $image
     * @param array $options
     * @return mixed
     */
    public function apply(Image $image, array $options = [ ])
    {
        $mask = $this->makeCircleMaskImage($image->width(), $image->height());

        $image = $image->mask($mask);

        return $image;
    }

    /**
     * @param int $width
     * @param int $height
     * @return Image
     */
    private function makeCircleMaskImage($width, $height)
    {
        $bigWidth = $width * 2;
        $bigHeight = $height * 2;

        $circle = \Image::canvas($bigWidth, $bigHeight, '#000000');

        $circle = $circle->circle($bigWidth - 1, $bigWidth / 2, $bigHeight / 2, function ($draw)
        {
            $draw->background('#ffffff');
        });

        $circle = $circle->resize($width, $height);

        return $circle;
    }
}

missing-1

samwalshnz on 5 Sep 2014

❤5

As far as I know, GD does not support AA. I recommend using Imagick.

But your hack looks interesting. I will take a look at this.