[Plugin: Geo Mashup] Custom marker: post thumbnail

Uhm… Firebug tells me that (in DOM) each GeoMashup.object has property ‘lundici_marker’ set correctly (to post image), while object.icon.image property is ‘undefined’.
As if my custom.js would not be executed.
Or… what?

Cheers,
rash*

I don’t promise support for custom code, but I can see a couple of potential hangups. get_the_post_thumbnail() returns HTML, not an image URL. Look at the code for that function to see how it gets the URL. Also, Firebug will tell you if custom.js is loading – if so it will be present in the script tab. You can debug it there also. Good luck!

Ok, got a solution, still incomplete though.

In my function.php file, I’ve put:

$tmp_img = wp_get_attachment_image_src(get_post_thumbnail_id($post_id), array(32,24));
$json_properties['lundici_marker'] = $tmp_img[0];

That gives me the image src. In my custom.js file I have now:

object.icon.image = object.lundici_marker.replace(/\\/g, "");
object.icon.iconSize = [ 32, 24 ];

First line removes backslashes from the url passed over, second line sets marker size.
Why incomplete then…? Because I do not have an image by that size and my map shows only the upper left corner. Well, right: this is a completely different matter! As far as Geo-Mashup, problem solved.
Thanks for your help (set me on the right path)!

Ciao,
rash*

Ok, here we go, hope this will help someone looking for the same thing.
To get images for markers I’ve installed a plugin (Custom Image Sizes) able to generate custom sized images on the run.
Then I’ve added following code to my theme’s function.php file:

function lundici_geo_mashup_locations_json_filter( $json_properties, $queried_object ) {
   $post_id = $queried_object->object_id;
   $tmp_img = wp_get_attachment_image_src(get_post_thumbnail_id($post_id), 'lundici_marker');
   $json_properties['lundici_marker'] = $tmp_img[0];

   return $json_properties;
}

add_image_size('lundici_marker', 36, 27);
add_filter( 'geo_mashup_locations_json_object','lundici_geo_mashup_locations_json_filter', 10, 2 );

In my custom.js file I now have:

GeoMashup.addAction( 'objectIcon', function( properties, object ) {
       // Use a special icon, post's thumbnail
       object.icon.image = object.lundici_marker.replace(/\\/g, "");
       object.icon.iconSize = [ 36, 27 ];
} );

That’s it!

Thanks!
rash*

Nice! I think WordPress will create custom image sizes via add_image_size() as long as you call add_theme_support( ‘post-thumbnails’ ) first.

Yep, at the moment I’ve only left to find a way to put a border around my markers but you can see the map in action here: https://lundici.it
(the border you see it’s a fake, it’s hand-made on images…)

Great anyway!
rash*