如何将map定义为全局变量以在另一个javascript函数中调用



所以我被困在搜索这个解决方案几个小时请帮助,这是我的代码,

    <html>
      <head>
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
        <meta charset="utf-8">
        <title>Simple markers</title>
        <style>
          html, body, #map-canvas {
            height: 100%;
            margin: 0px;
            padding: 0px
          }
        </style>
        <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=false"></script>
        <script type="text/javascript">
            var map;
            var marker;
            function initialize() {
                var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
                var mapOptions = {
                    zoom: 10,
                    disableDefaultUI: true,
                    center: myLatlng
                }
                map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
                marker = new google.maps.Marker({
                  position: myLatlng,
                  map: map,
                  title: 'Hello World!'
                });
            }
            function see(){
                alert(map);
                var newLatlng = new google.maps.LatLng(-25.363882,133.044922);
                map.setCenter(newLatlng);
            }
    google.maps.event.addDomListener(window, 'load', initialize);
see();
      </script>
      </head>
      <body>
        <div id="map-canvas"></div>
      </body>
    </html>

变量map称为undefined。在搜索之后,他们说map在赋值之前被调用(全局变量'map'是未定义)。如何解决这个已知的问题?请帮助

我的目标是通过使用javascript函数更新标记位置。(:

就像其他帖子说的,当它被引用时,地图还没有被分配。这是因为初始化函数只有在页面加载完成时才会被调用。在这个函数中会发生以下情况:

map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
在此之前,map是未定义的,即使您更改了它。因此,您可以在按下按钮时调用函数,也可以在初始化函数的末尾调用see()。两者都可行。这里我把see()放在初始化函数的末尾。
<html>
      <head>
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
        <meta charset="utf-8">
        <title>Simple markers</title>
        <style>
          html, body, #map-canvas {
            height: 100%;
            margin: 0px;
            padding: 0px
          }
        </style>
        <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=false"></script>
        <script type="text/javascript">
            var map;
            var marker;
            function initialize() {
                var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
                var mapOptions = {
                    zoom: 10,
                    disableDefaultUI: true,
                    center: myLatlng
                }
                map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
                marker = new google.maps.Marker({
                  position: myLatlng,
                  map: map,
                  title: 'Hello World!'
                });
                see();
            }
            function see(){
                alert(map);
                var newLatlng = new google.maps.LatLng(-25.363882,133.044922);
                map.setCenter(newLatlng);
            }
    google.maps.event.addDomListener(window, 'load', initialize);
      </script>
      </head>
      <body>
        <div id="map-canvas"></div>
      </body>
    </html>

最新更新