Javascript 全局变量google未声明

Javascript 全局变量google未声明,javascript,google-maps,web,Javascript,Google Maps,Web,嗨社区:)这是我的第一个问题。。。我刚刚在我的大学里开始了一个项目,我在下面的代码中遇到了很多问题,当然,我只想在google map javascript中得到帮助,为什么google变量没有声明,我如何解决这个问题,并通知我我的javascript链接是否正确,谢谢你的时间 <!DOCTYPE html> <html> <head> <title></title> <link r

嗨社区:)这是我的第一个问题。。。我刚刚在我的大学里开始了一个项目,我在下面的代码中遇到了很多问题,当然,我只想在google map javascript中得到帮助,为什么google变量没有声明,我如何解决这个问题,并通知我我的javascript链接是否正确,谢谢你的时间

    <!DOCTYPE html>
<html>
    <head>
        <title></title>
        <link rel="stylesheet" type="text/css" href="newcss.css">
        <link  rel="stylesheet" type="text/css" href="bootstrap.min.css">
        <link rel="stylesheet" type="text/javascript" href="jquery-1.11.3.min">




        <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDWDpusIBDYxjoYKh_r5uupBcd2vU3KXJY&callback=initMap" async defer></script><!-- Google Maps API -->
        <script>
            var map;    // Google map object (global variable)

            // Initialize and display a google map
            function initMap()
            {
                // Create a Google coordinate object for where to center the map
                var latlngDC = new google.maps.LatLng(38.8951, -77.0367);   // Coordinates of Washington, DC (area centroid)

                // Map options for how to display the Google map
                var mapOptions = {zoom: 12, center: latlngDC};

                // Show the Google map in the div with the attribute id 'map-canvas'.
                map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
            }

        </script>

    </head>




    <div class="container dynamicTile">
        <div class="row ">
            <div class="group_pos_row1">
                <div class="col-sm-4 col-xs-8">

                    <div id="tile7" class="tile">

                        <div class="carousel slide" data-ride="carousel">
                            <!-- Wrapper for slides -->
                            <div class="carousel-inner">
                                <div class="item active">
                                    <img src="http://handsontek.net/demoimages/tiles/gallery.png" class="img-responsive"/>
                                </div>
                                <div class="item">
                                    <img src="http://handsontek.net/demoimages/tiles/gallery2.png" class="img-responsive"/>
                                </div>
                                <div class="item">
                                    <img src="http://handsontek.net/demoimages/tiles/gallery3.png" class="img-responsive"/>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="col-sm-2 col-xs-4">
                    <div id="tile3" class="tile">

                        <div class="carousel slide" data-ride="carousel">
                            <!-- Wrapper for slides -->
                            <div class="carousel-inner">
                                <div class="item active">
                                    <img  src="http://2.bp.blogspot.com/_rpiNFFKB8DQ/TIkl0dm9d-I/AAAAAAAADdI/EwfJOMkqkP4/s400/Weekly+reading+book+boy.gif" alt="exercises"  class="img-responsive"/>

                                </div>
                                <div class="item">
                                    <img src="http://sites.psu.edu/siowfa14/wp-content/uploads/sites/13467/2014/10/1118284_orig.gif" class="img-responsive"/>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-2 col-xs-4">
                    <div id="tile4" class="tile">

                        <div class="carousel slide" data-ride="carousel">
                            <!-- Wrapper for slides -->
                            <div class="carousel-inner">
                                <div class="item active">
                                    <a href="https://www.facebook.com/%CE%88%CF%81%CE%B1%CF%83%CE%BC%CE%BF%CF%82-%CE%A6%CF%81%CE%BF%CE%BD%CF%84%CE%B9%CF%83%CF%84%CE%AE%CF%81%CE%B9%CE%BF-405469642829138/?fref=ts&__mref=message_bubble"><img src="http://handsontek.net/demoimages/tiles/facebook3.png" class="img-responsive"/></a>
                                </div>
                                <div class="item">
                                    <img src="http://handsontek.net/demoimages/tiles/facebook2.png" class="img-responsive"/>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>

        <div class="row">

            <div class="group_pos_row2">
                <div class="col-sm-4 col-xs-8">


                    <div id="map-canvas"></div>

                </div>                                    
            </div>




            <div class="col-sm-2 col-xs-4">
                <div id="tile8" class="tile">

                    <div class="carousel slide" data-ride="carousel">
                        <!-- Wrapper for slides -->
                        <div class="carousel-inner">
                            <div class="item active">
                                <img src="http://handsontek.net/demoimages/tiles/music.png" alt="Relevant textual alternative to the image" class="img-responsive"/>
                            </div>
                            <div class="item">
                                <img src="http://handsontek.net/demoimages/tiles/music2.png" alt="Relevant textual alternative to the image" class="img-responsive"/>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
            <div class="col-sm-2 col-xs-4">
                <div id="tile9" class="tile">

                    <div class="carousel slide" data-ride="carousel">
                        <!-- Wrapper for slides -->
                        <div class="carousel-inner">
                            <div class="item active">
                                <img src="http://handsontek.net/demoimages/tiles/calendar.png" alt="Relevant textual alternative to the image" class="img-responsive"/>
                            </div>
                            <div class="item">
                                <img src="http://handsontek.net/demoimages/tiles/calendar2.png" alt="Relevant textual alternative to the image" class="img-responsive"/>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>



</html>

变量映射;//谷歌地图对象(全局变量)
//初始化并显示谷歌地图
函数initMap()
{
//为地图的居中位置创建Google坐标对象
var latlngDC=new google.maps.LatLng(38.8951,-77.0367);//华盛顿特区的坐标(区域质心)
//如何显示谷歌地图的地图选项
var mapOptions={zoom:12,center:latlngDC};
//在div中显示属性id为“map canvas”的Google地图。
map=new google.maps.map(document.getElementById('map-canvas'),mapOptions);
}

您需要删除第一个
,只保留第二个
函数,将
Init
函数重命名为
initMap
,因为这是您在第二个
元素末尾传入回调参数的函数名(callback=
initMap


  • 尝试删除对
    的第一个引用。如果您使用
    async
    属性,那么google脚本将异步加载,这意味着它现在不可用。您是对的,但我仍然有相同的问题,我的api密钥一定有问题