PHP Art

He has: 697 posts

Joined: Jul 2005

I have, for some time, been working on developing a fully-capable graphing calculator with PHP, and to put together the graphing interface, I have been exploring the GD library. Upon seeing all the geometric functions and drawing tools available, I decided I had to fulfill my artistic ambitions with this tool, so I created a black-and-white portrait of one of my favorite musical artists, Phil Collins. The code for it is posted below. I know it's not organized nor perhaps most efficient, but it creates an image that I'm happy with.

header("Content-type: image/png");
//Fiddling around with the GD library for PHP
$image = imagecreate(300,300);
$image_bg = imagecolorallocate($image,255,255,255);
$image_line = imagecolorallocate($image,0,0,0);
    $right_black = array(247,0,244,38,245,43,243,46,239,49,239,54,237,55,234,56,241,56,240,59,236,59,239,60,234,61,233,63,230,93,227,108,196,188,300,233,300,0);
    imagefilledpolygon($image,$right_black,(count($right_black)/2),$image_line);
    $left_black = array(0,0,0,300,77,300,55,269,81,263,66,259,66,251,93,240,122,249,144,250,143,253,118,300,148,300,169,247,169,237,157,248,129,248,110,243,54,208,24,164,33,142,35,109,24,78,29,0);
    imagefilledpolygon($image,$left_black,(count($left_black)/2),$image_line);
    $top_black = array(22,0,53,46,62,49,73,49,81,53,84,57,88,62,95,68,102,71,110,71,97,66,95,64,93,48,96,49,102,46,102,44,109,44,111,55,114,49,117,50,122,51,124,47,125,52,128,45,130,52,132,53,135,54,136,56,139,56,131,52,129,45,131,47,132,46,133,49,134,50,134,47,141,48,123,41,115,41,115,44,121,44,122,46,118,48,114,41,76,47,71,43,118,36,90,31,96,28,71,29,72,23,74,0);
    imagefilledpolygon($image,$top_black,(count($top_black)/2),$image_line);
    $left_brow = array(124,36,131,34,124,33,130,33,134,35,136,32,142,32,144,34,148,34,152,38,161,42,167,46,174,39,183,16,180,30,175,43,165,52,166,51,161,60,152,61,150,64,142,51,136,41,132,38,125,36);
    imagefilledpolygon($image,$left_brow,(count($left_brow)/2),$image_line);
    imageline($image,97,30,105,30,$image_line);
    imageline($image,115,29,119,29,$image_line);
    imageline($image,113,31,114,31,$image_line);
    imageline($image,121,27,125,27,$image_line);
    imageline($image,97,30,105,30,$image_line);
    imageline($image,100,27,109,27,$image_line);
    imageline($image,94,24,100,24,$image_line);
    imageline($image,124,28,139,29,$image_line);
    $right_eye = array(187,58,191,47,195,43,192,49,196,39,197,31,197,39,196,44,193,47,193,48,195,47,197,43,196,47,198,45,199,38,201,33,200,39,203,34,200,46,208,38,216,38,213,42,218,43,223,44,223,47,204,46,194,51,204,49,229,53,229,55,231,59,227,58,226,63,223,70,218,78,210,83,204,81,196,77,192,71,201,77,211,79,216,77,222,69,227,58,226,55,225,55,222,61,220,64,215,67,219,63,222,58,218,59,215,60,214,57,218,56,218,54,214,54,213,57,211,59,209,59,208,56,195,58,213,53,218,52,216,51,202,50,191,54,189,56);
    imagefilledpolygon($image,$right_eye,(count($right_eye)/2),$image_line);
    imageline($image,224,45,229,45,$image_line);
    imageline($image,224,43,230,43,$image_line);
    imageline($image,220,42,225,42,$image_line);
    imageline($image,227,47,232,47,$image_line);
    imageline($image,216,41,220,41,$image_line);
    imageline($image,226,35,228,35,$image_line);
    imageline($image,218,36,224,36,$image_line);
    imageline($image,228,39,238,42,$image_line);
    imageline($image,232,35,239,40,$image_line);
    $nose = array(163,132,166,123,161,113,155,108,143,109,142,112,140,115,137,116,134,120,131,127,133,140,140,146,144,151,153,157,165,156,166,162,170,163,170,157,176,150,190,145,181,146,178,143,171,137,161,137,157,136,144,134,137,134,136,126,140,119,145,115,156,118,158,128);
    imagefilledpolygon($image,$nose,(count($nose)/2),$image_line);
    $mouth = array(191,173,182,178,176,179,170,178,163,180,158,180,152,177,141,176,126,175,118,173,111,170,114,175,108,176,111,177,116,177,125,178,140,179,147,180,159,183,165,182,175,181,180,180,184,181,188,182,187,177,191,174);
    imagefilledpolygon($image,$mouth,(count($mouth)/2),$image_line);
    $nose_edge = array(190,86,190,103,190,104,190,85);
    imagefilledpolygon($image,$nose_edge,(count($nose_edge)/2),$image_line);
    $chin = array(133,191,135,196,140,198,144,203,153,205,160,202,166,200,171,198,171,196,164,195,162,191,147,190,142,192,138,192);
    imagefilledpolygon($image,$chin,(count($chin)/2),$image_line);
    $chin2 = array(147,227,146,239,142,247,151,248,158,248,155,238,154,236,151,230,149,225);
    imagefilledpolygon($image,$chin2,(count($chin2)/2),$image_line);
    $shirt = array(149,300,170,247,170,237,180,218,187,205,196,188,300,233,300,300);
    $gray = imagecolorallocate($image,46,45,29);
    imagefilledpolygon($image,$shirt,(count($shirt)/2),$gray);
imagepng($image);
imagedestroy($image);

Now, I did use Microsoft Paint and its infinite wisdom to assist with approximations of beginnings and endings of certain "polygons," and the rest was estimated and tweaked over and over. I'm wondering, is there any future for PHP art in your opinion? I know a much better rendering could be done with an actual Photoshop software or similar product, but I was so pleased with this method.

Kurtis

AttachmentSize
phil_collins.png5.3 KB
decibel.places's picture

He has: 1,494 posts

Joined: Jun 2008

Hi Kurtis,

That is a nice picture!

phil collins

I wonder, can you use your data to create a Google Chart - perhaps a type of scatter plot or maybe a venn diagram?

I think your method could be useful with user input to create/alter an image dynamically - I'm not sure what alternate methods are available.

Your image is more "graphic" than "photorealistic" so I would think there may be "graphic" uses (comix etc).

Good luck with the Brickfish competition!

He has: 697 posts

Joined: Jul 2005

Yeah, it's definitely easier to create a graphic effect because everything is so "straight-line." It is possible to create smoother edges and even shading, but it would take even more work. Who knows, I may try it out.

Using user input to alter images is definitely what I'm working toward; this was simply a personal experiment. Wink

Kurtis

decibel.places's picture

He has: 1,494 posts

Joined: Jun 2008

everything is so "straight-line."

That is why I suggested the Google Charts scatter or venn diagrams, using rounded blobs instead of linear elements.

Actually, I think you can mix marker shapes, some round, some square...

I guess this is really left-field!

He has: 697 posts

Joined: Jul 2005

The main thing I dislike about trying to graph things this way is that pixel positions are based from the top left corner (as all images do), meaning that the point (max,max) would actually be displayed in the bottom-right corner instead of the top-right corner like in a traditional graph. It just takes a few computations to x- and y-values to make it look right, though. It definitely can be frustrating to the mind, though. Wink

Kurtis

pr0gr4mm3r's picture

He has: 1,505 posts

Joined: Sep 2006

That is really nifty.

JeevesBond's picture

He has: 3,955 posts

Joined: Jun 2002

That is really cool. It's impressive because you got closer to the metal and used something a lot lower-level than Photoshop.

You could also apply non-destructive effects using GEGL. Don't seem to be any PHP bindings for that though.

a Padded Cell our articles site!

They have: 2 posts

Joined: Mar 2010

Quote:
Originally Posted by Busy
I picked up php and css quite easily but javascript i could never get into, weird i know.
Busy...

how can you do php if you don't know java script???????

{Link Removed}

They have: 1 posts

Joined: Apr 2010

Thanks alot man, really helped!

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.