I believe you’ll need to additional trigger the Google Maps Javascript after the AJAX call. This is an example of how you can trigger it again:
https://github.com/WordImpress/Support-Snippets/blob/master/google-maps-builder/redraw-map.php
Let me know how that goes.
How should i implement this code, i’m not sure how to do it
actually i have 3 parts of my code
/* INDEX.PHP / TRIGGER ACTION*/
<button class=”ver-mapa flex-it flex-align-item-center” data-shortcode=”42″><i class=”icon-location”></i>Ver en mapa</button>
/* FUNCTIONS.PHP / AJAX CALL */
add_action( ‘wp_ajax_show_map’, ‘show_map’);
add_action( ‘wp_ajax_nopriv_show_map’, ‘show_map’);
function show_map() {
$short = ‘[google_maps id=”‘.$_REQUEST[‘shortcode’].'”]’;
echo do_shortcode($short);
die();
}
/* HEADER.PHP / DO AJAX CALL */
$(‘.ver-mapa’).click(function(){
var ajaxUrl = ‘<?php echo admin_url(‘admin-ajax.php’); ?>’;
var data = {
action: ‘show_map’,
shortcode: $(this).attr(‘data-shortcode’)
}
$.post(ajaxUrl,data).done(function(response) {
$(‘.lightbox-map’).show();
$(‘.lightbox-map’).append(response);
console.log(response);
});
});
It’s hard to say exactly, but the root of the problem is that our localized data isn’t being loaded because of your AJAX call. The plugin really isn’t built to be rendered that way. I’d recommend having the map on the page at load time and redrawing it when the lightbox initializes.
