Bubble.ro - because there is always something new to learn about

How to convert an image to grayscale using PHP

 

Category: Programming/PHP

Although converting an image (usually in true color) to grayscale can sound like a simple operation if you are used to image processing software, PHP doesn't have a function for this conversion by default.

Grayscale images


A grayscale image contains only various levels of gray in the image, which can be expressed mathematically by the red, green and blue values (expressed as RGB) all equal.

Convert an image to grayscale

Still, true color images can have any value for r, g and b, so in order to convert this to a grayscale value a transformation is needed.

RGB and HSV

HSV stands for Hue, Saturation and Value. In order to represent an image in grayscale, all we need is to use the Value, with no Hue or Saturation. There are conversion equations from one to each other, so all we need to do is use them.
               
H = pow(cos( ( (1/2)*( (r-g)+(r-b) ) / ( sqrt( (r-g)*(r-g) + (r-b)*(g-b) ) ) ), -1);

S = 1 - (3 / (r+g+b))*min(r,g,b) );

V = (1/3) * (r + g + b);
The first two may seem quite complicated, but all we need is the third, which is simply the average.

Now, since we need to represent the image again in grayscale, we'll just use the calculated Value for all three r, g and b.
<?php
$source_file = "test_image.jpg";

$im = ImageCreateFromJpeg($source_file);

$imgw = imagesx($im);
$imgh = imagesy($im);

for ($i=0; $i<$imgw; $i++)
{
        for ($j=0; $j<$imgh; $j++)
        {
       
                // get the rgb value for current pixel
               
                $rgb = ImageColorAt($im, $i, $j);
               
                // extract each value for r, g, b
               
                $rr = ($rgb >> 16) & 0xFF;
                $gg = ($rgb >> 8) & 0xFF;
                $bb = $rgb & 0xFF;
               
                // get the Value from the RGB value
               
                $g = round(($rr + $gg + $bb) / 3);
               
                // grayscale values have r=g=b=g
               
                $val = imagecolorallocate($im, $g, $g, $g);
               
                // set the gray value
               
                imagesetpixel ($im, $i, $j, $val);
        }
}

header('Content-type: image/jpeg');
imagejpeg($im);
?>
If you are not familiar with the r,g and b values from RGB aggregated value, you should read this article:

- How to check if an image is grayscale in PHP

Posted by: Indy on October 30, 2006 at 07:51.
 

» Comments

it is better to use imagefilter functin
there is a function called imagefilter in php that convert image to gray scale, smiply like this
imagefilter($im, IMG_FILTER_GRAYSCALE);

Posted by Habes on July 3, 2007 at 09:56 AM.

Only in PHP 5
The imagefilter function is only available in PHP5, so for older versions you still need to use a custom function.

Posted by Indy on July 4, 2007 at 07:13 AM.

More Sophisticated Ways To Convert Color to Gray
While it is easy and fast to simply average together the red, green and blue channels to obtain a single luminance channel, more sophisticated procedures are available, such as using Y from the YIQ color space. See, for instance:

http://www.cs.rit.edu/~ncs/color/t_convert.html#RGB%20to%20YIQ%20&%20YIQ%20to%20RGB

http://www.poynton.com/PDFs/ColorFAQ.pdf

http://www.nationmaster.com/encyclopedia/YIQ


Posted by Will Dwinnell on December 18, 2007 at 01:06 PM.

HSV Value definition
I'm sorry, but in the HSV color space the value is defined differently as a full red RGB(255,0,0) would have a value of 1 or 100% respectively. So would any other color with a 255 value in it. Your equation creates an average instead which is imo not the correct conversion function.

Instead it should be the maximum of (r,g,b).

Cu!

Posted by Holger Göbber on July 18, 2008 at 06:24 PM.

lolwut
To Holger;

Using the average is correct, let me try to explain:

if there's a red pixel - 255,0,0 - its about a third of white, if you know what i mean. White is the brightest color, but only 1/3th of that is used, because the green and blue are 0.

When we use average, we basically divide 255 by 3, which is 85.
3 * 85 (r,g,b all have 85) is 255 again, so it's as bright as it used to be.

--

If we use your method, simply use the highest value of the three colors, see what would happen:

If we had a purple pixel - 255,0,255) it would come out as 255,255,255, which is white. If there was also a red pixel, it would also come out as white. If any color contains 255, it would be white.

Furthermore, if you need prove, try both. You'll see your method produces faulty images.

--

Hope this explanation was somewhat clear, as i fail terribly at explaining =P

-Ziao

Posted by Ziao on March 22, 2009 at 04:54 PM.

@Ziao
Hi Ziao,

I was working on a small graphic composition script in PHP when I came across your script. My main point is that the definition of HSV is differently from what you need for your grayscaling.

In computer graphics the behaviour of HSV colors is precisely that: pure red equals to a saturation of 100% and a value of 100%, not to an average of white.

At least in any graphics program I have come across so far...

I think I needed a slightly different thing for my script because it was a kind of simple alphamasking where I combined images based on grayscale values so I don't know how I adapted it.

So my point is not about a bug in the script but merely a nitpick about wording. Pure HSV <> RGB conversion would usually work a little different.

Posted by Holger Göbber on April 3, 2009 at 12:26 PM.

This is what I came up with...
http://www.hm2k.com/posts/how-to-convert-an-image-to-greyscale-using-php

Posted by HM2K on December 14, 2009 at 12:29 PM.

great job!
great job!

Posted by Shizi on February 5, 2010 at 11:12 AM.

New, very easy to use script
You can use the script that makes the selected photos grayscale and in the case of mouseover the colors are restored. It is easy to use, just put "grayscale" as the classes of the images. It used PHP and JavaScript for developing the script.

Script homepage: http://rubensargsyan.com/grayscale/

Posted by Ruben Sargsyan on March 24, 2010 at 08:13 AM.

Good article !
Thanks for this explaination. With so much frameworks and libraries, we forget to understand how functions we are using work.

Posted by Ninsuo on December 14, 2010 at 12:02 AM.

Its working like charm. This is what I expected
Its working like charm. This is what I expected

Posted by Navaneeth on June 13, 2013 at 11:19 AM.

Now turn the greyscale to something blue
i tried this example which worked like a spark converting from color to grayscale, now i want to convert the graysale to something blue, or perhaps i could turn it to bluescale in the first place. i wonder which parameters i would need to change to get the blue scale.

Posted by J.P. Wilbrand on January 5, 2014 at 02:52 PM.

Random Article


Search


Feeds


Bubble.ro RSS Feed

All Categories


Articles


Aetolia - The Midnight Age
How to create the histogram of an image using PHP
How to convert an image to grayscale using PHP
How to check if an image is grayscale in PHP
Interchanging 2 variables without the use of a third
Error launching browser window:no XBL binding for browser
Convert the AOL user session collection to a MySQL database
Introduction to Matlab
Creating a customized session handling system in PHP (part II)
Creating a customized session handling system in PHP (part I)
Firefox crashing with Yahoo! Messenger
ADL Search for oDC
Video codecs explained
Browsershots
How to use Auto-Away Message with oDC
Create complete Windows XP disk with SP2 and all updates
Data Execution Prevention error message in Windows XP
Google Mars
Logarithmic scale graphs in Excel
Urban Dictionary (or wtf does l33t mean?)
Learn more about BIOS
Backup your Firefox and Thunderbird settings
Syndicate your Yahoo 360 profile
What is Google PageRank?
'Cannot Open the File: Mk:@MSITStore' Error Message
Get your Gmail with Mozilla Thunderbird
E-Books links
Change the size of your Explorer thumbnails
Remove previews from Windows Explorer
How can I turn off system beeps?
How do I disable Internet Explorer?
What are proxies or how do I protect my anonymity?
How to set aliases triggers or macros in MushClient
What is RSS?
Palm Zire 31 fast review
oDC Installation and Basic Configuration
How I built a 2x80W amplifier (using power modules)
Leech/HotLink Protection
How to block referrer detection?
How to find out your IP address
Getting started with Mushclient
What is spyware and how do I protect my PC from it?
Stumble Upon - random surfing around the web
Automatic file backup for Windows users
How can I read foreign language sites?
Protect your web surfing privacy!
What is BitTorrent?
No more ads! Adblock for Firefox
Why use Firefox instead of Internet Explorer?
How do I create my own Yahoo ID?
© Copyright 2006-2015 Bubble. All rights reserved. Sitemap - Contact