Updating the drawing script

Now you know how to draw individual pixels and lines, we can go back and edit the polygon drawing script from before so that it does something more interesting for the first two clicks. From click three onwards we have enough points to draw a polygon, but by click one we have enough for a point and by click two we have enough for a line. What we're going to do is edit the switch/case block in picture3.php so that in case 1 we draw a point and in case 2 we draw a line, leaving case 3 for polygon drawing. Therefore, the switch/case block needs to be changed to this:

switch($pointcount) {
    case 0:
        break;
    case 1:
        imagesetpixel($image, $_SESSION['points'][0], $_SESSION['points'][1], $green );
        break;
    case 2:
        imageline($image, $_SESSION['points'][0], $_SESSION['points'][1], $_SESSION['points'][2], $_SESSION['points'][3], $green );
        break;
    default:
        imagefilledpolygon($image, $_SESSION['points'], $pointcount, $green);
}

That finishes off the drawing script nicely, although there are other possible changes if you're willing to try them out yourself:

  • Add a dropdown box to select the pen colour and pen thickness

  • Let people choose whether to use a fill image or a plain colour. Even better, let people upload their own pictures for fills!

  • Add an option to let people save their image on the server for later editing. This is best done by serializing the points array and saving it in a database.

  • For extra points, allow people to save their image as a graphics file, then load it back in for re-editing. This has the advantage of letting them draw one polygon, save it out as an image, then reload that image and draw another, different polygon on top.

 

Want to learn PHP 7?

Hacking with PHP has been fully updated for PHP 7, and is now available as a downloadable PDF. Get over 1200 pages of hands-on PHP learning today!

If this was helpful, please take a moment to tell others about Hacking with PHP by tweeting about it!

Next chapter: Special effects using imagefilter() >>

Previous chapter: Points and lines

Jump to:

 

Home: Table of Contents

Copyright ©2015 Paul Hudson. Follow me: @twostraws.