One common graphics scenario is to put some overlay images at specific data-driven locations, stacking those overlays on top of another base graphic. This hack starts with the map in Figure 4-10 as the base image.
Then it places the star graphic in Figure 4-11 onto the map, over the city of San Francisco, as it might appear if you were looking up a location by city or Zip code.
Save the (rather simple) code in Example 4-8 as graphic.php.
Example 4-8. PHP making overlaying graphics almost trivial
The code starts by reading in the map and star graphics. Then it creates a new image, superimposing the
star onto the map using the
imagecopy() function. The new version of the
map—which at this point exists only in memory—is then output to the
browser using the
After uploading the PHP script and the images to your server, navigate your browser to graphic.php. There you will see an image like that shown in Figure 4-12.
The star on the map is cool, but it's a bit big. Instead of sitting on top of San Francisco, it ends up sitting on top of most of California. Let's scale it down a little. Save the code in Example 4-9 as graphic2.php.
Example 4-9. A little bit of scaling
Then navigate to the new script in your web browser; you shouldsee the graphic shown in Figure 4-13.
This new version of the script uses the
imagecopyresized() function to change the size
of the star image as it's copied onto the map. The script divides
the star's width and height by 5, scaling the image to 20% of its