2012-04-01 77 views
1

我试图将iframe中的Google地图居中。下面的代码是iframe的内容。 标记不在框架的中心。Google地图中的中心标记

缺什么?

<!DOCTYPE html> 
<html> 
    <head> 
    <style type="text/css"> 
     html { height: 100% } 
     body { height: 100%; margin: 0; padding: 0 } 
     #map_canvas { height: 100% } 
    </style> 
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=MYAPIKEY&sensor=false"></script> 
    <script type="text/javascript"> 


function initialize() { 
     var myLatlng = new google.maps.LatLng('<?php echo $this->uri->segment(5); ?>', '<?php echo $this->uri->segment(4); ?>'); 
      var myOptions = { 
      zoom: 8, 
       mapTypeControl: false, 
       scaleControl: false, 
      center: myLatlng, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
      } 
      var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

      var marker = new google.maps.Marker({ 
       position: myLatlng, 
       map: map, 
       title:"Hello World!" 
      }); 

     } 


     initialize(); 


    </script> 
    </head> 
    <body onload="initialize()"> 
    <div id="map_canvas" style="width:100%; height:100%"></div> 
    </body> 
</html> 

UPDATE

我想我已经解决了它买设定一个固定大小的map_canvas提供,而不是使用100%。 我现在工作好多了。

+0

是的,但问题是当我把它放在一个iframe中时,它不再居中。 – 2012-04-01 11:04:32

+0

@工程师。请创建一个答案,我会选择它作为最佳答案。 – 2012-04-02 10:27:41

回答