Question

经过几次这样的文档后，我一直在墙上敲我的头！我似乎无法通过API错误来让地图显示在我的网站上。

我从网页上收到以下错误消息，我想要显示地图：

Google已禁止将Maps API用于此应用程序。提供的密钥不是有效的Google API密钥，也未授权此网站上的Google Maps Javascript API v3。如果您是此应用程序的所有者，则可以在此处了解如何获取有效密钥：https://developers.google.com/maps/documentation/javascript/tutorial#Obtaining_Key

我（已经好几次）进入我的帐户并且：

启用了Maps v3 API服务
生成了新的API密钥
将我允许的推荐人添加到密钥中。（www.domain.com和domain.com网址）

我在网页的头部添加了以下脚本：

<script src="http://maps.googleapis.com/maps/api/js?sensor=false&amp;key=MY_API_KEY_HERE" type="text/JavaScript" language="JavaScript"></script>

我在页面上点击链接时执行以下JavaScript函数：

alert("viewMap()");
var map = new GMap3(document.getElementById("map_canvas"));
var geocoder = new GClientGeocoder();

var address = "1600 Amphitheatre Parkway, Mountain  View";
alert("Calling getLatLng ...");
geocoder.getLatLng(address, function(point) {
    var latitude = point.y;
    var longitude = point.x;  

    // do something with the lat lng
    alert("Lat:"+latitude+" - Lng:"+longitude);
});

显示初始viewMap()警报，然后是“Google已禁用使用...”错误消息。

错误控制台还显示'GMap3未定义'。

任何人都可以协助向我展示我的方式错误吗？

Answer 1

也许只需将GMap3行更改为：

var myOptions = {zoom: 5,mapTypeId: google.maps.MapTypeId.ROADMAP};
var map = new google.maps.Map(document.getElementById('map_canvas'),myOptions);

以下是使用navigator.geolocation代替GClientGeocoder的更完整示例：

<!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" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true"></script>
<style>
#map_canvas {width:300px;height:300px;display:block;}
</style>
</head>

<body>
<div id="map_canvas"></div>
<button onclick="begin();">Click</button>
</body>
<script>
function begin(){
    navigator.geolocation.getCurrentPosition(loadmap,noloc);
}

function noloc(){ alert('Since this is a location based tool, please reload and share your location');}

function loadmap(position){

    var myOptions = {
        zoom: 5,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById('map_canvas'),myOptions);
    var latitude=position.coords.latitude;
    var longitude=position.coords.longitude;
        //do something with the lat lng
    var usrll=new google.maps.LatLng(latitude,longitude);
    map.setCenter(usrll);
    var usrmarker = new google.maps.Marker({position: usrll,map: map});

}   
</script>
</html>

Answer 2

有几个问题，其中最严重的问题是使用<script>标记加载版本3 API，然后使用版本2代码，如GClientGeocoder。在任一版本中都不存在GMap3。

将版本2映射转换为版本3并不像加载版本3 API那么简单。它需要从头开始重写（这超出了SO的范围）。

您没有说明您使用的推荐人，但您需要明确使用通配符：www.domain.com/*，domain.com/*

我建议您将GMap3更改为GMap2，并确保加载版本2 API（在相关的<script>代码中指定您的控制台密钥）。然后着手重写第3版。

Google已禁止使用Maps API将此应用程序与GMaps JS API v3一起使用

2 个答案: