为什么Google Map无法在JavaScript中加载？

Question

I am following the the steps given in this link https://developers.google.com/maps/documentation/javascript/tutorial I am getting error after load can you tell me where I wrong ? 我正在执行此链接中给出的步骤https://developers.google.com/maps/documentation/javascript/tutorial加载后出现错误，您能告诉我哪里错了吗？ I already generate key ? 我已经生成了密钥？ fiddle http://jsfiddle.net/p3kcztvb/1/ 小提琴http://jsfiddle.net/p3kcztvb/1/

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0; padding: 0 }
      #map-canvas { height: 100% }
    </style>
    <script type="text/javascript"
      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyATC35pv00Ga3hRxP4t5W7NtM9as48PGVQs">
    </script>
    <script type="text/javascript">
      function initialize() {
        var mapOptions = {
          center: new google.maps.LatLng(-34.397, 150.644),
          zoom: 8
        };
        var map = new google.maps.Map(document.getElementById("map-canvas"),
            mapOptions);
      }
      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
    <div id="map-canvas"/>
  </body>
</html>

Answer 1

Following error explain itself. 以下错误说明了自己。

"provided key is not a valid Google API Key,"

Generate correct key 产生正确的金钥

To create your API key:

    Visit the APIs Console at https://code.google.com/apis/console and log in with your Google Account.
    Click the Services link from the left-hand menu.
    Activate the Google Maps JavaScript API v3 service.
    Click the API Access link from the left-hand menu. Your API key is available from the API Access page, in the Simple API Access section. Maps API applications use the Key for browser apps.

here 这里

图片在这里

Markup Code as follow:- 标记代码如下：

// Adds a marker with popup window information
  var marker1Latlng = new google.maps.LatLng(35.65654,-106);
  var contentString1 = 'I love New Mexico! <a href="http://www.newmexico.org">More</a> about the Land of Enchantment';
  var infowindow = new google.maps.InfoWindow({
      content: contentString1
  });
  var marker1 = new google.maps.Marker({
      position: marker1Latlng,
      map: map,
      title: 'New Mexico'
  });
  google.maps.event.addListener(marker1, 'click', function() {
    infowindow.open(map,marker1);
  });
//End of Add Marker code

Answer 2

Hi Kanika in Fiddle it seems like the API key you are using is not a valid key. 嗨，Fiddle的Kanika似乎您使用的API密钥无效。 You might need to regenerate the API key for Google Maps API Engine from your Google Console. 您可能需要从Google控制台重新生成Google Maps API Engine的API密钥。

Answer 3

Change this code lines - basically you don't need a api key in here 更改此代码行-基本上，这里不需要api键

<script type="text/javascript"
      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyATC35pv00Ga3hRxP4t5W7NtM9as48PGVQs">
    </script>

Replace with 用。。。来代替

 <script type="text/javascript"
      src="https://maps.googleapis.com/maps/api/js?v=3.exp">
    </script>

为什么Google Map无法在JavaScript中加载？

问题描述

3 个解决方案

解决方案1
1 已采纳 2014-09-01 10:35:00

解决方案2
1

解决方案3
0 2014-09-01 10:53:36

为什么Google Map无法在JavaScript中加载？

问题描述

3 个解决方案

解决方案1 1 已采纳 2014-09-01 10:35:00

解决方案2 1

解决方案3 0 2014-09-01 10:53:36

解决方案1
1 已采纳 2014-09-01 10:35:00

解决方案2
1

解决方案3
0 2014-09-01 10:53:36