Reload google map using jquery

[b0xed]

I created a selection system which allow some hidden divs to show when people select an option. So I put a shortcode map in those divs, when people select an option, nothing shows at the place of map. Tried to unhide 1 selection, that loads perfectly. So I ended up with this decision that the divs need to reload everytime I select an option. Tried .load() but it doesn’t work. I am new in jquery, don’t know much about it. I found a related post here- https://community.theme.co/forums/topic/google-map-not-displaying-quite-right/ See the preview live here - http://panam2.elastichorizon.com/506-2/ Here’s the code, Can you guys tell me what should I do to make it reload(divs are working perfectly, I can load images, texts on anything else without map here)?

<select id="reason">
  <option value="---">---</option>
  <option value="KISSIMMEE COMMERCIAL CENTER">KISSIMMEE COMMERCIAL CENTER</option>
  <option value="WEST GABLES">WEST GABLES</option>
  <option value="CORKSCREW GROVE">CORKSCREW GROVE</option>
</select>
<script>
$(document).ready(function () {
  $('.note').hide();
  $('#reason').change(function () {
    $('.note').hide();
    var val = $(this).val();
    $('#blank, #blank1').hide();
    $('#KISSIMMEE, #KISSIMMEE1').hide();
    $('#WEST_GABLES, #WEST_GABLES1').hide();
    $('#CORKSCREW_GROVE, #CORKSCREW_GROVE1').hide();
    if (val == '---') {
      $('#blank1').show();
    }
    else if (val == 'KISSIMMEE COMMERCIAL CENTER') {
      $('#KISSIMMEE1').show();
    }
    else if (val == 'WEST GABLES') {
      $('#WEST_GABLES1').show();
    }
    else if (val == 'CORKSCREW GROVE') {
      $('#CORKSCREW_GROVE1').show();
    }
  });
});
</script>
<div id="blank1">[x_google_map lat="25.7518632" lng="-80.2600151" zoom="12" zoom_control="true" drag="true" height="210px" hue="false" no_container="false" ][/x_google_map]</div>
<div id="KISSIMMEE1" style="display:none;">[x_google_map lat="25.7518632" lng="-80.2600151" zoom="14" zoom_control="true" drag="true" height="210px" hue="false" no_container="false" ][x_google_map_marker lat="25.7518632" lng="-80.2600151" info="" image=""][/x_google_map]</div>
<div id="WEST_GABLES1" style="display:none;">[x_google_map lat="51.508530" lng="-0.076132" zoom="14" zoom_control="true" drag="true" height="210px" hue="false" no_container="false" ][x_google_map_marker lat="51.508530" lng="-0.076132" info="" image=""][/x_google_map]</div>
<div id="CORKSCREW_GROVE1" style="display:none;">[x_google_map lat="40.730610" lng="-73.935242" zoom="14" zoom_control="true" drag="true" height="210px" hue="false" no_container="false" ][x_google_map_marker lat="40.730610" lng="-73.935242" info="" image=""][/x_google_map]</div>