我有一个 web 应用程序，我在其中使用 ajax 加载所有页面，现在我正在尝试使用下面的页面加载谷歌地图。
问题解决了，现在我可以用下面的代码加载一个只有地址（地理编码）的谷歌地图。
<div id="map_external" class="notransform mapExternal">
<input id="address" type="hidden" value="kungsgatan 14,varberg,sweden">
<div id="header" class="toolbar">
<h1>Google Map</h1>
<a href="#" class="back">BACK</a>
</div>
<div id="map_canvas" style=" height:600px!important;" class="notransform"></div>
<script>
jQuery(document).ready(function(){
$('#map_external').bind('pageAnimationStart', function(event, info){
if (info.direction == 'in') {
googleMaploadScript();
}
});
});
function googleMaploadScript() {
var script =document.createElement("script");
script.type="text/javascript";
script.src="http://maps.google.com/maps/api/js?sensor=false&callback=initialize";
document.body.appendChild(script);
//alert("script loaded");
}
var geocoder;
var map;
function initialize() {
geocoder = new google.maps.Geocoder();
var mapOptions = {
zoom: 15,
center: undefined,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
image = new google.maps.MarkerImage("http://www.mypage.com/images/googlemap/info.png",new google.maps.Size(32, 45));
shadowi = new google.maps.MarkerImage("http://www.mypage.com/images/googlemap/shadow.png",new google.maps.Size(51, 37));
codeAddress();
}
function codeAddress() {
var address = document.getElementById('address').value;
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location,
shadow: shadowi,
icon: image
});
} else {
alert('Geocode was not successful for the following reason: ' + status);
}
});
}
</script>
</div>