AJAX Implementation

kindly check what i’m working

https://beta3.technodreamcenter.com/voyagesgauthier.com/voyage_cat/en-liberte/

I want to make the map dynamic via ajax. I’m using this code on my callback to replace the default map but it will just show white empty. Do you have idea how to solve this?

$err_suc['map'] = do_shortcode( "[display-map id='5466']" );

Hi @sigfred
Loading the map with ajax won’t be so straight forward. Rendering the shortcode will only output the HTML, but you also need to make sure all necessary assets are loaded. If the html code and the assets are loaded, you can trigger the map with the code iMaps.init(false);
Greetings, Carlos

The first load has no problem and it is loading the map and assets. But when I try to change the map via ajax it will just display nothing. Is there a solution here or this is not possible?

kindly see, after loading map try to click any on “Amerique du Sud | Asie | | Europe | Oceanie

https://beta3.technodreamcenter.com/voyagesgauthier.com/voyage_cat/en-liberte/

When the page first loads, it loads correctly the assets and data for the current map. When you change map, it would need to load also the data for the new map and the map file, which it doesn’t it just keeps the main assets and the data for the original map. Basically your ajax call is not running the wp_enqueue_script hooks to load that. I think it would be easier if you just place all maps already in hidden tabs.

I understand but it really needs to be ajax because static is not an option in our case.

Kindly help me in this situation. Specify the scripts needed to make it work via AJAX

Thanks for helping. I had it figured it out. Not using AJAX anymore.

Kindly check French Polynesia map. It seems it’s wrong

Hi @sigfred
Consider that the maps provided are in real scale and with French Polynesia islands being so small and so far apart, they will look small. Is that what you’re referring to or is there a different issue?
This is how they are currently looking: https://pasteboard.co/mNjNGLphWlQk.png