Posted By

cyberhobo on 04/20/12


Tagged

wordpress-geo-mashup custom-js markers


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

hurcy


WordPress Geo Mashup Mapstraction Custom Markers


 / Published in: JavaScript
 

URL: http://code.google.com/p/wordpress-geo-mashup/wiki/Documentation#Custom_JavaScript

Some common custom javascript for customizing geo mashup map markers for Mapstraction map providers (any other than Google v2). The marker images used are 24 x 24 pixels, anchored at the bottom center, with no shadow. You'd put images in wp_content/plugins/geo-mashup-custom/images to work with this snippet.

  1. (function() {
  2.  
  3. GeoMashup.addAction( 'colorIcon', function( properties, icon, color_name ) {
  4. // For single category icons use the Geo Mashup color icon names,
  5. // but the 24x24 ones in the custom image directory
  6. icon.image = properties.custom_url_path + '/images/mm_20_' + color_name + '.png';
  7. icon.iconShadow = '';
  8. icon.iconSize = [ 24, 24 ];
  9. icon.iconAnchor = [ 12, 24 ];
  10. icon.iconInfoWindowAnchor = [ 12, 1 ];
  11. } );
  12.  
  13. GeoMashup.addAction( 'objectIcon', function( properties, obj ) {
  14.  
  15. if ( obj.terms.category.length == 0 ) {
  16.  
  17. // When there are no categories - mm_20_uncategorised.png
  18. obj.icon.image = properties.custom_url_path + '/images/mm_20_uncategorised.png';
  19. obj.icon.iconShadow = '';
  20. obj.icon.iconSize = [ 24, 24 ];
  21. obj.icon.iconAnchor = [ 12, 24 ];
  22. obj.icon.iconInfoWindowAnchor = [ 12, 1 ];
  23.  
  24. } else if ( obj.terms.category.length > 1 ) {
  25.  
  26. // When there is more than one category - mm_20_mixed.png
  27. obj.icon.image = properties.custom_url_path + '/images/mm_20_mixed.png';
  28. obj.icon.iconShadow = '';
  29. obj.icon.iconSize = [ 24, 24 ];
  30. obj.icon.iconAnchor = [ 12, 24 ];
  31. obj.icon.iconInfoWindowAnchor = [ 12, 1 ];
  32.  
  33. }
  34. } );
  35.  
  36. GeoMashup.addAction( 'multiObjectMarker', function( properties, marker ) {
  37.  
  38. // When there is more than one marker assigned to the same location - mm_20_plus.png
  39. marker.setIcon( properties.custom_url_path + '/images/mm_20_plus.png' );
  40.  
  41. } );
  42.  
  43. GeoMashup.addAction( 'singleMarkerOptions', function ( properties, options ) {
  44.  
  45. // When the map is a single object map with just one marker
  46. options.icon.image = properties.custom_url_path + '/images/mm_20_uncategorised.png';
  47. options.icon.iconShadow = '';
  48. options.icon.iconSize = [ 24, 24 ];
  49. options.icon.iconAnchor = [ 12, 24 ];
  50. options.icon.iconInfoWindowAnchor = [ 12, 1 ];
  51.  
  52. } );
  53. }());

Report this snippet  

You need to login to post a comment.