嗨社区:)这是我的第一个问题...我刚刚在我的大学开始了一个项目,我在下面的代码中遇到了很多问题,但我只想在谷歌地图javascript中获得帮助,为什么谷歌变量未申报,我如何解决这个问题并通知我,如果我的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>
答案 0 :(得分:0)
您需要移除第一个<script>
并仅保留第二个传递Maps API密钥的地方,并将Init
函数重命名为initMap
,因为这是您的函数名称在第二个<script>
元素末尾传递回调参数(callback = initMap
)。
尝试删除您对<script src="https://maps.googleapis.com/maps/api/js
将您的功能Init
重命名为initMap