load google map api3 over click ajax call

[Petani]

hi guys, im new with google map, i need some help.

i have ajax call, here:

$('#checkbtn').click(function(e)
{
       e.preventDefault();
	var lo=$("#long").val();
	var la=$('#lat').val();
	$.ajax({
		url:BASEURL+'register/checklocation',
		type:'POST',
		data:{log:lo,lat:la},
		success:function(data)
		{	
			$('#view_checkmap').html(data);
		}
	});
});

here is my view to view the map:

<script>
function initialize()
{
  		var myLatlng = new google.maps.LatLng(<?php echo $lat; ?>,<?php echo $long; ?>);
  		var mapOptions = {
    		zoom: 15,
		    center: myLatlng,
		    mapTypeId: google.maps.MapTypeId.ROADMAP
 		}
 		var map = new google.maps.Map(document.getElementById('mymap'), mapOptions);
		var marker = new google.maps.Marker({
      		position: myLatlng,
      		map: map,
      		title: 'my location'
  		});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<div id="mymap" style="width:500px; height:300px;"></div>

when i access to the URL, it displays, but when i access over ajax, nothing display.
is my code worng or something else?
thanks in advance.