Question

我有一个webapp，我用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>

Answer 1

问题已解决，请参阅上面有关如何在ajax加载页面中加载地理编码的Google地图的信息。

加载在ajax页面中进行地理编码的谷歌地图

1 个答案: