With ever project there are always helper functions that do simple things. This function is something i created to help make icons for my WoWMap site. All you need to do is pass it an associative array (aka an object in JS) and it will return the google maps GIcon object customed with your options.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | function makeIcon(options) { var settings = $.extend({ 'image': 'icons/white.png', 'shadow': 'shadow.png', 'iconSize': [24,28], 'shadowSize': [36,24], 'iconAnchor': [12,27], 'infoWindowAnchor': [20,3] }, options); var base_icon = new GIcon(G_DEFAULT_ICON); base_icon.image = 'assets/img/'+settings.image; base_icon.shadow = 'assets/img/'+settings.shadow; base_icon.iconSize = new GSize(settings.iconSize[0],settings.iconSize[1]); base_icon.shadowSize = new GSize(settings.shadowSize[0],settings.shadowSize[1]); base_icon.iconAnchor = new GPoint(settings.iconAnchor[0],settings.iconAnchor[1]); base_icon.infoWindowAnchor = new GPoint(settings.infoWindowAnchor[0],settings.infoWindowAnchor[1]); return base_icon; } |
I use the jQuery extend function to merge the any provided options with the default options.
If you want to use this with your site you will need to change the url for the image and shadow property on line 13 and 14. You can also extend this to edit the other properties of the GIcon object, these are just the basic ones needed to customize (at least for me).
Tags: javascript, jquery, snipits
