Shapes in PNG

This is a demonstration of how we can generate PNG images using PHP. I wrote this as a demonstration module for my PHP class to show how to generate files other than HTML files using PHP.

There are 6 shapes: circle, square, disc, diamond, triangle, and arrow.

There are 8 directions: north, ne, east, se, south, sw, west, and nw. Directions only apply to triangles and arrows.

Like some other projects, we draw these shapes with random background colors. You can see a new set of random colors when you refresh the page. You can also specify a color (see the bottom of this page).

We calculate the internal colors to contrast with the background colors. This module happens to choose between a light and dark shade of teal.

You can view the PHP source code for the shape generator.

I converted this code to draw SVG images instead of PNG. Some advantages of SVG over PNG are:

• With SVG, we can rotate the shapes to arbitrary angles, instead of just cardinal or pre-defined angles like N, S, E, W, etc.
• SVG files are much smaller than the equivalent PNG files.
• SVG files can be scaled arbitrarily, so they are more suited to high-density or retina displays.

PNG images do have the advantage of being more broadly supported in browsers. PNG images can be useful as a fallback mechanism where SVG images are not supported.