Load another jvectormap on region click

javascript, jquery, jvectormap

Solution

In order to use the switchMap function, you must initialize the new vectorMap after the file was fully loaded, thus intializing it in a callback. .

function switchMap(code) {
    $.getScript('maps/'+ code +'.js' , function (data){
        $('#map').vectorMap({map: code});
    });
}

Problem

I'm trying to load the specific region map `onRegionClick`. However it seems as though the region is loading after the change is made. Here's my code: ``` function switchMap(code) { $.getScript('maps/'+ code +'.js'); $('#map').vectorMap({map: code}); } $('#map').vectorMap({ map: 'world_mill_en', onRegionClick: function(event, code) { if (code == "CA") {switchMap(code)} if (code == "AF") {switchMap(code)} if (code == "AL") {switchMap(code)} if (code == "AR") {switchMap(code)} if (code == "CH") {switchMap(code)} } }); ``` The console output is this: ``` Uncaught Error: Attempt to use map which was not loaded: CA world-map.js:82 OPTIONS file:///C:/Users/D-4/Desktop/find-a-bible/maps/CA.js?_=1364318443130 jquery-1.8.2.js:8416 ```

Original source