2013-01-31 50 views
0

嘿傢伙我試圖爲我的地圖添加不同的層,但我遇到了一些天氣層的麻煩。當我自己添加交通層時,地圖的作品,但是當我只在地圖應該出現的地方添加天氣圖層。任何幫助將非常感謝!谷歌地圖的天氣層沒有出現,但流量是

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<meta name="Description" content="Get ready to experience Indianapolis! This site will make your visit the best one yet!"/> 
<title>The Indy Tour- Travel</title> 
<link href="../style/style.css" rel="stylesheet" type="text/css" /> 
<link href='http://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic,700italic' rel='stylesheet' type='text/css'/> 
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyA6VosQrKQOjoTbDSp4Kk4BHvofOJFUfZU&sensor=true"></script> 
    <script type="text/javascript"> 
     var map; 
     function initialize() { 
      var myOptions = { 
      zoom: 9, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
      }; 

     var all = [ 
      ["Indianapolis International Airport", "7800 Col. H. Weir Cook Memorial Drive", "Indianapolis", "IN", "46241", "null", "null", "airport"],   
      ["Indianapolis International Airport", "7800 Col. H. Weir Cook Memorial Drive", "Indianapolis", "IN", "46241", "39.71449", "-86.29842", "airport"], 
      ["Location 2", "7205 Olmstead Dr", "Burlington", "NC", "27215", "36.069974", "-79.548101", "airport",], 
      ["Location 3", "W Market St", "Graham", "NC", "27253", "36.0722225", "-79.4016207", "resturant"], 
      ["Location 4", "Mt Hermon Rock Creek Rd", "Graham", "NC", "27253", "35.9826328", "-79.4165216", "hotel"], 
      ["Location 5", "415 Spring Garden St", "Greensboro", "NC", "27401", "36.06761", "-79.794984", "hotel"] 
     ]; 

     var infoWindow = new google.maps.InfoWindow; 
     map = new google.maps.Map(document.getElementById('map_canvas'), myOptions); 

     var trafficLayer = new google.maps.TrafficLayer(); 
    trafficLayer.setMap(map); 
    var weatherLayer = new google.maps.weather.WeatherLayer({ 
    temperatureUnits: google.maps.weather.TemperatureUnit.CELSIUS 
}); 
weatherLayer.setMap(map); 

var cloudLayer = new google.maps.weather.CloudLayer(); 
cloudLayer.setMap(map); 


     var pos = new google.maps.LatLng(39.76656, -86.15); 
     map.setCenter(pos); 

     function infoCallback(infowindow, marker) { 
      return function() { 
      infowindow.open(map, marker); 

     }; 



    }    
    function setMarkers(map, all) { 
    for (var i in all) {           
      var name = all[i][0]; 
      var address = all[i][1]; 
      var city = all[i][2]; 
      var state = all[i][3]; 
      var zip  = all[i][4]; 
      var lat  = all[i][5]; 
      var lng  = all[i][6]; 
      var image = all[i][7]; 
      var latlngset; 
      latlngset = new google.maps.LatLng(lat, lng); 

      var icon=null; 
      if (image=="airport") { 
       icon=airport; 
       var marker = new google.maps.Marker({ 
       map: map, title: city, position: latlngset, icon: icon, shadow: shadow 
      }); 
      } 
      else if (image=="hotel") { 
       icon=hotel; 
       var marker = new google.maps.Marker({ 
       map: map, title: city, position: latlngset, icon: icon, shadow: shadow 
      }); 
      } 
      else if (image=="resturant") { 
       icon=resturant; 
       var marker = new google.maps.Marker({ 
       map: map, title: city, position: latlngset, icon: icon, shadow: shadow 
      }); 
      } 

      var airport = new google.maps.MarkerImage(
      '../images/airport.png', 
      new google.maps.Size(32,37), 
      new google.maps.Point(0,0), 
      new google.maps.Point(16,37) 
      ); 
      var hotel = new google.maps.MarkerImage(
      '../images/hotel.png', 
      new google.maps.Size(32,37), 
      new google.maps.Point(0,0), 
      new google.maps.Point(16,37) 
      ); 
      var resturant = new google.maps.MarkerImage(
      '../images/resturant.png', 
      new google.maps.Size(32,37), 
      new google.maps.Point(0,0), 
      new google.maps.Point(16,37) 
      ); 
      var shadow = new google.maps.MarkerImage(
      '../images/shadow.png', 
      new google.maps.Size(54,37), 
      new google.maps.Point(0,0), 
      new google.maps.Point(16,37) 
      ); 
      var content = '<div class="map-content"><h3>' + name + '</h3>' + address + '<br />' + city + ', ' + state + ' ' + zip + '<br /><a href="http://maps.google.com/?daddr=' + address + ' ' + city + ', ' + state + ' ' + zip + '" target="_blank">Get Directions</a></div>';     
      var infowindow = new google.maps.InfoWindow(); 
       infowindow.setContent(content); 
       google.maps.event.addListener(
       marker, 
       'click', 
       infoCallback(infowindow, marker) 
      ); 
      } 
     }   
     setMarkers(map, all); 
     }; 
     google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
</head> 

<body> 
<div id="logo"> 
    <div id="wrap"> 
     <div id="header"> 
      <ul> 
       <li><a href="../index.html">Home</a></li> 
       <li><a href="History.html">History</a></li> 
       <li><a href="Attractions.html">Attractions</a></li> 
       <li><a href="Landmarks.html">Landmarks</a></li> 
       <li><a href="#" style="color:#F60; text-decoration:underline;">Travel</a></li> 
      </ul> 
     </div> 

     <div id="content"> 
      <h1 id="title">Travel</h1> 
      <div id="map_canvas"></div> 
      <img id="line" alt="footer" src="../images/footer.png"/> 
      <div id="footer"> 
        <ul id="ftext"> 
        <li><a href="About.html">About the Team and Site</a></li> 
        <li><p style="display:inline;">Created 2012-2013 for BPA.</p></li> 
        <li><a href="Credits.html">Credits</a></li> 
       </ul> 

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


</body> 
</html> 

回答

2

weatherLayer需要默認情況下未加載的weather-library。

<script type="text/javascript" 
    src="http://maps.googleapis.com/maps/api/js?libraries=weather&key=AIzaSyA6VosQrKQOjoTbDSp4Kk4BHvofOJFUfZU&sensor=true"></script> 
+0

不能相信我錯過soemthign如此明顯,謝謝! – kduan