没有工作

我是新来使用谷歌地图API谷歌地图API的例子，我使用的谷歌关闭文档一些示例代码不工作，我想知道如果有人能帮助我解决它为什么止跌”为我工作？下面是代码本身：<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=true" ></script>没有工作

<script> 
    var directionDisplay; 
    var directionsService = new google.maps.DirectionsService(); 
    var map; 

    function initialize() { 
    directionsDisplay = new google.maps.DirectionsRenderer(); 
    var chicago = new google.maps.LatLng(41.850033, -87.6500523); 
    var mapOptions = { 
     zoom:7, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     center: chicago 
    } 
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
    directionsDisplay.setMap(map); 
    } 

    function calcRoute() { 
    var start = document.getElementById('start').value; 
    var end = document.getElementById('end').value; 
    var request = { 
     origin:start, 
     destination:end, 
     travelMode: google.maps.DirectionsTravelMode.DRIVING 
    }; 
    directionsService.route(request, function(response, status) { 
     if (status == google.maps.DirectionsStatus.OK) { 
     directionsDisplay.setDirections(response); 
     } 
    }); 
    } 
</script>

这里是HTML：

` <body onload="initialize()"> 
<div> 
<b>Start: </b> 
<select id="start" onchange="calcRoute();"> 
    <option value="chicago, il">Chicago</option> 
    <option value="st louis, mo">St Louis</option> 
    <option value="joplin, mo">Joplin, MO</option> 
    <option value="oklahoma city, ok">Oklahoma City</option> 
    <option value="amarillo, tx">Amarillo</option> 
    <option value="gallup, nm">Gallup, NM</option> 
    <option value="flagstaff, az">Flagstaff, AZ</option> 
    <option value="winona, az">Winona</option> 
    <option value="kingman, az">Kingman</option> 
    <option value="barstow, ca">Barstow</option> 
    <option value="san bernardino, ca">San Bernardino</option> 
    <option value="los angeles, ca">Los Angeles</option> 
</select> 
<b>End: </b> 
<select id="end" onchange="calcRoute();"> 
    <option value="chicago, il">Chicago</option> 
    <option value="st louis, mo">St Louis</option> 
    <option value="joplin, mo">Joplin, MO</option> 
    <option value="oklahoma city, ok">Oklahoma City</option> 
    <option value="amarillo, tx">Amarillo</option> 
    <option value="gallup, nm">Gallup, NM</option> 
    <option value="flagstaff, az">Flagstaff, AZ</option> 
    <option value="winona, az">Winona</option> 
    <option value="kingman, az">Kingman</option> 
    <option value="barstow, ca">Barstow</option> 
    <option value="san bernardino, ca">San Bernardino</option> 
    <option value="los angeles, ca">Los Angeles</option> 
</select> 
</div>`

来源

2013-03-15 davidbenjamin998

据我了解u需要谷歌ID /关键可以做谷歌地图。你是否有一个？ – 2013-03-15 16:23:20

我在脚本的最顶端？ – davidbenjamin998 2013-03-15 16:25:08

当我添加我的API密钥时，我总是收到以下消息： Google已经禁止将Google Maps API用于此应用程序。所提供的密钥不是有效的Google API密钥，也未授权此网站上的Google Maps JavaScript API v3。如果您是此应用程序的所有者，您可以在这里了解如何获取有效密钥：https：//developers.google.com/maps/documentation/javascript/tutorial#api_key – davidbenjamin998 2013-03-15 16:25:59

初始化（）函数需要被调用。它可以在<body>标签是这样的：

<body onload="initialize();">

来源

2013-03-15 16:27:39 Vero

我已经在我的身体已经标记并 – davidbenjamin998 2013-03-15 16:28:32

你也有ID =地图画布元素的页面，其中地图是里面显示？ – Vero 2013-03-15 16:33:15

是的，我做的是低于我所有的HTML – davidbenjamin998 2013-03-15 16:42:36

你有元素得到start和end值？此代码适用于从joliet到内珀维尔的路由：

<!DOCTYPE html> 
<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=false"></script> 
<style> 
#map-canvas {height:500px;width:500px;} 
</style> 
</head> 

<body onload="initialize()"> 
<div id="map-canvas"></div> 
<div> 
<b>Start: </b> 
<select id="start" onchange="calcRoute();"> 
    <option value="chicago, il">Chicago</option> 
    <option value="st louis, mo">St Louis</option> 
    <option value="joplin, mo">Joplin, MO</option> 
    <option value="oklahoma city, ok">Oklahoma City</option> 
    <option value="amarillo, tx">Amarillo</option> 
    <option value="gallup, nm">Gallup, NM</option> 
    <option value="flagstaff, az">Flagstaff, AZ</option> 
    <option value="winona, az">Winona</option> 
    <option value="kingman, az">Kingman</option> 
    <option value="barstow, ca">Barstow</option> 
    <option value="san bernardino, ca">San Bernardino</option> 
    <option value="los angeles, ca">Los Angeles</option> 
</select> 
<b>End: </b> 
<select id="end" onchange="calcRoute();"> 
    <option value="chicago, il">Chicago</option> 
    <option value="st louis, mo">St Louis</option> 
    <option value="joplin, mo">Joplin, MO</option> 
    <option value="oklahoma city, ok">Oklahoma City</option> 
    <option value="amarillo, tx">Amarillo</option> 
    <option value="gallup, nm">Gallup, NM</option> 
    <option value="flagstaff, az">Flagstaff, AZ</option> 
    <option value="winona, az">Winona</option> 
    <option value="kingman, az">Kingman</option> 
    <option value="barstow, ca">Barstow</option> 
    <option value="san bernardino, ca">San Bernardino</option> 
    <option value="los angeles, ca">Los Angeles</option> 
</select> 
</div>` 
     <script> 
    var directionDisplay; 
    var directionsService = new google.maps.DirectionsService(); 
    var map; 

    function initialize() { 
    directionsDisplay = new google.maps.DirectionsRenderer(); 
    var chicago = new google.maps.LatLng(41.850033, -87.6500523); 
    var mapOptions = { 
     zoom:7, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     center: chicago 
    } 
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
    directionsDisplay.setMap(map); 
    } 

    function calcRoute() { 
    var start = document.getElementById('start').value; 
    var end = document.getElementById('end').value; 
    var request = { 
     origin:start, 
     destination:end, 
     travelMode: google.maps.DirectionsTravelMode.DRIVING 
    }; 
    directionsService.route(request, function(response, status) { 
     if (status == google.maps.DirectionsStatus.OK) { 
     directionsDisplay.setDirections(response); 
     } 
    }); 
    } 
</script> 
</body> 
</html>

来源

2013-03-15 16:32:07

有我的HTML，你是如何得到它为你的工作？ – davidbenjamin998 2013-03-15 16:35:17

什么不适合你？你没有收到地图吗？没有获得路线？你有没有办法真正运行'calcRoute'函数（就像我这里的“go”按钮）？ – 2013-03-15 16:37:18

对不起，我应该说，我没有得到地图或任何东西 – davidbenjamin998 2013-03-15 16:38:16

在结束终止组合框div后，似乎还有一个错误。不造成伤害，但不属于。

来源

2013-03-18 14:54:05 ginalster

回答

相关问题