使用Google Directions API将PHP变量添加到Javascript函数中_Javascript_Php_Api_Google Maps_Google Directions Api

使用Google Directions API将PHP变量添加到Javascript函数中

javascript php api google-maps

使用Google Directions API将PHP变量添加到Javascript函数中,javascript,php,api,google-maps,google-directions-api,Javascript,Php,Api,Google Maps,Google Directions Api,我是一个使用谷歌API的新手。我正在创建一个应用程序，需要使用数据库中保存的地址来显示事件的路由。我发现了一个模板，允许我在GoogleMapsAPI中手动更改Javascript变量，但是当我尝试在函数中使用PHP变量时，它不会加载映射。我还没有将它连接到我的数据库，我只是想让它使用PHP变量我只是想知道是否有人能给我指出正确的方向并帮助我 <head> <meta http-equiv="content-type" content="text/html; cha

我是一个使用谷歌API的新手。我正在创建一个应用程序，需要使用数据库中保存的地址来显示事件的路由。我发现了一个模板，允许我在GoogleMapsAPI中手动更改Javascript变量，但是当我尝试在函数中使用PHP变量时，它不会加载映射。我还没有将它连接到我的数据库，我只是想让它使用PHP变量

我只是想知道是否有人能给我指出正确的方向并帮助我

  <head>
   <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
   <title>Google Maps API v3 Directions Example</title>
   <script type="text/javascript"
           src="https://maps.googleapis.com/maps/api/js?
key=MYKEYHERE&callback=initMap"></script></head>

<?php 
$start = "Leeds";
$end = "Nottingham";
?>

<body>


     <div id="map"></div>

     <div id="right-panel"></div>


   <script type="text/javascript">

     var directionsService = new google.maps.DirectionsService();
     var directionsDisplay = new google.maps.DirectionsRenderer();

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

     directionsDisplay.setMap(map);
     directionsDisplay.setPanel(document.getElementById('right-panel'));


     var request = {
       origin: <?php echo $start; ?>,
       destination: <?php echo $end; ?>,
       travelMode: google.maps.DirectionsTravelMode.DRIVING
     };

     directionsService.route(request, function(response, status) {
       if (status == google.maps.DirectionsStatus.OK) {
         directionsDisplay.setDirections(response);
       }
     });
   </script>
</body>
</html>


谷歌地图API v3方向示例
var directionsService=new google.maps.directionsService（）；
var directionsDisplay=new google.maps.DirectionsRenderer（）；
var map=new google.maps.map（document.getElementById（'map'）{
缩放：7，
mapTypeId:google.maps.mapTypeId.ROADMAP
});
方向显示.setMap（地图）；
directionsDisplay.setPanel（document.getElementById（'right-panel'）；
var请求={
来源：，
目的地：，
travelMode:google.maps.Directions travelMode.DRIVING
};
路由（请求、功能（响应、状态）{
if（status==google.maps.directionstatus.OK）{
方向显示。设置方向（响应）；
}
});

我已经查看了您的代码，看起来您正在以“包含地名的字符串”的形式传递原点和目的地值，在谷歌地图API中，它将以谷歌地图API中规定的方式接收一个地点的坐标、lat和long：

因此，您应替换以下代码：

 var request = {
       origin: <?php echo $start; ?>,
       destination: <?php echo $end; ?>,
       travelMode: google.maps.DirectionsTravelMode.DRIVING
     };

var请求={
来源：，
目的地：，
travelMode:google.maps.Directions travelMode.DRIVING
};

代码与我刚才发布的代码类似。

希望这将对您有所帮助。

您是否在浏览器控制台中收到任何错误消息。。。？请注意，如果

$start

和

$end

存储文本，则必须将它们括在引号中：

来源：，

您所做的是告诉JavaScript使用一个名为

Leeds

的变量，该变量不存在。查看生成的源代码或控制台错误会告诉您这一点。感谢您的回复。我已经添加了引号，但仍然没有乐趣。我检查了控制台，只发现一个错误。未捕获Vbmessage：“initMap不是函数”名称：“InvalidValueError”如映射脚本URL末尾所述，脚本需要一个名为

initMap（）

的函数，该函数包含初始化映射的代码。将脚本命令包装到该函数中，如dev.google上的示例所示，它应该可以工作？确保他们正在输出一些东西。它们可能输出一个空字符串或null，导致

initMap（）

函数失败。我正在使用的PHP变量只是回显一个位置，例如“Nottingham”。当我手动更改原点和目标时，地图会加载，但当我尝试使用变量进行更改时，地图不会加载。我不明白为什么不。

 var request = {
       origin: <?php echo $start; ?>,
       destination: <?php echo $end; ?>,
       travelMode: google.maps.DirectionsTravelMode.DRIVING
     };