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