堆栈溢出错误创建标记

时间:2015-04-30 17:08:13

标签: javascript iframe google-maps-api-3 flex3 stack-overflow

我正在使用谷歌地图javascript api V3在我们基于adobe flex的应用程序中创建地图。我正在使用flex iframe在flex和javascript api之间进行通信。我有两个问题。

我在html文件中调用一个函数来在html的div标签中创建地图。然后地图显示,但当我调用另一个函数来创建标记时,我得到堆栈溢出错误。在分析这个问题时,我发现不知何故它无法获得先前方法创建的地图的引用。有没有办法解决这个问题。请找到代码

<!DOCTYPE html>
<html> 
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>Google Maps Markers</title>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"
    type="text/javascript"></script>

</head>
<body>
<div id="map-canvas" style="width: 650px; height: 250px;"></div>

<script type="text/javascript">


var map;

var DFWCenter =  new google.maps.LatLng(32.9017,-97.0405770);    

function showMap()
  {

     map = new google.maps.Map(document.getElementById('map-canvas'), {
      zoom: 15,
    center: DFWCenter,
    mapTypeId: google.maps.MapTypeId.HYBRID  
    });

 }  

function createCustomMarker(station,lat1, lang1){
    var marker= new google.maps.Marker({
      position:  new google.maps.LatLng(lat1,lang1),
      map: map
     });

  marker.setMap(map);
 }

</script>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

@deejay:如果你没有得到地图的参考,你可以尝试将它作为一个全局变量,我试过这个并且无法生成你的情况因为它工作得很好,当我第一次打电话showMap()然后createCustomMarker()。 检查fiddle

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <title>Google Maps Markers</title>
        <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
        <script type="text/javascript">
        var DFWCenter = new google.maps.LatLng(32.9017, -97.0405770);

        function showMap() {

            map = new google.maps.Map(document.getElementById('map-canvas'), {
                zoom: 15,
                center: DFWCenter,
                mapTypeId: google.maps.MapTypeId.HYBRID
            });
            createCustomMarker(DFWCenter.A, DFWCenter.F);
        }

        function createCustomMarker(lat1, lang1) {
            var marker = new google.maps.Marker({
                position: new google.maps.LatLng(lat1, lang1),
                map: map
            });

            marker.setMap(map);
        }
        </script>
</head>

<body onload="showMap()">
    <div id="map-canvas" style="width: 650px; height: 250px;"></div>
</body>

</html>