Hacking Google Maps and Google Earth (ExtremeTech)

(Dana P.) #1

Chapter 10 — Overlaying Statistical Data 199


Building the Original Image
Building the original image is really about choosing (or creating) an image and then saving the
file in the PNG format with a transparent background. For the icon in the example, you can
build an icon similar to the pushpin provided by Google Maps.


Figure 10-8 shows the basic components used to build the pushpin. I used OmniGraffle on
Mac OS X, but just about any image or drawing program can be used to build the icon. If the
elements shown are combined into a single graphic, the topmost element is the one on the left,
the bottommost is on the right, with a little spatial adjustment you can build a very good icon.
Some elements were also adjusted for line width to make them more visible.


FIGURE10-8: Building an icon.


The final icon can be seen in Figure 10-9.


FIGURE10-9: The final icon.


Once the basic icon is complete, save it as a PNG with a transparent background, or copy the
icon to Photoshop or a similar graphics program and do the same. The transparent background
is vital to ensure that the pushpin appears as a pushpin, not a square graphic on the map.


Adding a shadow makes the icon look better onscreen and the gives the pushpin the feeling
that it has, literally, just been pushed into the map.


Building a Shadow
Building a shadow is more complicated. For the item to look like a shadow, it needs to be
skewed and the color altered (to black). You also need to be careful and ensure that you do not
adjust the left-hand edge and distance of the point, because it is the point distance and height
that allow the icon and shadow to be overlaid on one another to generate the final icon.


Center Circle
leader

Circle Point
Mask

Main
Circle
Free download pdf