Google Maps Div显示:无不居中

时间:2013-02-24 21:08:15

标签: javascript google-maps-api-3 coldfusion

我的问题Google地图div无法正常显示

<div id="g#arena.aid#" style="width: 600px; height: 300px; display: none"></div> 

未显示 - 代码显示地图为div - 但未居中...不以标记为中心...

似乎无法找到解决方案......头痛......

所以上市竞技场......希望隐藏他们的地图直到被召唤...... 使用图像调用:

    <img src="../images/gps1.png" height=25 border=0 alt="Show Map" 
           onclick="javascript:showElement('g#arena.aid#'); google.maps.event.trigger(document.getElementById('g#arena.aid#'),'resize');">

这是javascript - 它可以很好地显示地图,但它不以标记为中心......

地图需要正文载入......

  <body onload="initialize()">

  <script type="text/javascript">
    function initialize() {

    var #arena.aid#Latlng = new google.maps.LatLng(
        #arena.agpslat#,#arena.agpslong#);

    var #arena.aid#Options = {
        zoom: 15,
        center: #arena.aid#Latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var map = new google.maps.Map(
        document.getElementById("g#arena.aid#"),
        #arena.aid#Options);

    var marker = new google.maps.Marker({
        position: #arena.aid#Latlng,
        map: map,
        title: '#JsStringFormat(arena.arenaname)#'
       });
    }

  google.maps.event.addDomListener(window, 'load', initialize);

  google.maps.event.trigger(map, 'resize');

  </script>

相关的这段代码显示地图很好 - 但不是中心标记 - 思想?

这是生成的脚本...显示完整的地图 - 但没有居中......

      <img src="../images/gps1.png" height=25 border=0 alt="Show Map" 
    onclick="javascript:showElement('gxoazormo'); google.maps.event.trigger(document.getElementById('gxoazormo'),'resize');">


   <div id="gxoazormo" style="width: 600px; height: 300px; display: none"></div>


    <script type="text/javascript">
      function initialize() {

    var xoazormoLatlng = new google.maps.LatLng(
        51.0914344788,-114.200531006);

    var xoazormoOptions = {
        zoom: 15,
        center: xoazormoLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var map = new google.maps.Map(
        document.getElementById("gxoazormo"),
        xoazormoOptions);

    var marker = new google.maps.Marker({
        position: xoazormoLatlng,
        map: map,
        title: 'Bowness Sportsplex'
     });
    }

      google.maps.event.addDomListener(window, 'load', initialize);

google.maps.event.trigger(map, 'resize');

     </script>

1 个答案:

答案 0 :(得分:1)

var currCenter = map.getCenter();
google.maps.event.trigger(map, 'resize');
map.setCenter(currCenter);

它会集中......