1

长期读者,第一次海报。希望大家能帮帮我。我是 PHP 和 JavaScript 的绝对新手,但对 HTML 很擅长,并且有过使用 Google 地图的经验,但这对我来说是一种新方法。也是我第一次使用 V3 Google Maps API。

背景资料

我正在尝试为我的公司重写一个里程计算器,因为它使用了旧的 Yahoo Maps API,所以它已经坏了,而且我已经快要破解它了,我可以尝到它了!我已经能够感觉到自己在身边,并从过去的程序员留下的东西中学到了一点关于 PHP 的知识,但是我在完成最后一点时遇到了麻烦。

下面粘贴的代码使用单独的 PHP 文件 (getaddress.php) 和 URL 中的 ?cid=FOOBAR 来查询我们的 MySQL 数据库并提取客户地址并生成 Google 地图/行车路线页面。

我的斗争是将数据从数据库中提取到谷歌地图显示标签中的 var“路线”中。我能够完美地回应它:

<?php echo "Directions to " . $_GET['cid'];?>

但我无法想出一种方法来将相同的文本回显到路由变量中。问这个问题我有点尴尬,因为我确定这很简单,我只是忽略了它,但它是那种“不知道你在寻找什么来寻找解决方案”的事情之一,所以我转向你们所有人和你们的才能。

“起源:'123 Easy Street' 将始终是硬编码的,所以这不是问题。问题是我想用 getaddress.php 从数据库中提取的信息填充“目的地:”,它看起来例如 HTML 正文中的“1234 Easy Street 46142”。

有没有人对我如何将该地址字符串放入 JavaScript 中路由变量的“目的地:”部分有任何建议?

我非常感谢大家可以提出的任何替代想法。我难住了。

getGmap.php 代码

<?php require('constants.php');?>
<?php require('sessionHandler.php');?>
<?php require('dbHandler.php');?>
<?php if (!isset($_GET['cid']) || empty($_GET['cid'])) die('No company specified.');?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"  xmlns:v="urn:schemas-microsoft-com:vml">
  <head>
    <title>Driving Directions to Customer provided by Google Maps</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
        <link type="text/css" href="./lib/default.css" rel="stylesheet">

  <script type="text/javascript"
           src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCnWPIRN8X0gLNqz-c1d87gv84CwZDuzjc&sensor=false"></script>

  <script>

        function process(){
                //Main processing starts here.
                //call getAddress. 
                getAddress();
        }

        //*** Get company information from database ***
        var req;                //global http request object

        function getAddress(){
                var url="getaddress.php?ajax=1&cid=<?php echo $_GET['cid'];?>";
                if (window.XMLHttpRequest) {    // IE/Windows ActiveX version
                req = new XMLHttpRequest();
                req.onreadystatechange = processReqChange;
                req.open("GET", url, true);
                req.send(null);
          }
          else if (window.ActiveXObject) {
                req = new ActiveXObject("Microsoft.XMLHTTP");
                if (req) {
                    req.onreadystatechange = processReqChange;
                    req.open("GET", url, true);
                    req.send();
                }
          }
          return true;
        }

        //*** End get company information from database ***

    </script>
  </head>

  <body onload="process()">
        <font class="normalText"><b>
        <?php echo "Directions to " . $_GET['cid'];?>
        <span id="addressSpan"></span>
        from 123 Easy Street
        </b></font>
        <br />
        <font class="normalText10">
        <div style="width: 600px;">
             <div id="map" style="width: 280px; height: 400px; float: left;"></div>
             <div id="panel" style="width: 300px; float: right;"></div>
        </div>
        </font>
        <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('panel'));

             var route = {
               origin: '123 Easy Street',
               destination: '1234 Easy Street 46142',
               travelMode: google.maps.DirectionsTravelMode.DRIVING
             };

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

getaddress.php 代码

<?php require('constants.php'); ?>
<?php require('sessionHandler.php'); ?>
<?php require('dbHandler.php'); ?>
<?php

if (isset($_GET['cid']) && !empty($_GET['cid'])) {
        //we only pass 5 chars of short id - actual id may be longer
        $query="select Address1, City, State, Zipcode from companies where CompanyShortID like '".$_GET['cid']."%'";
}
else
        die('Error: No company specified.');

dbConnect();
$result=mysql_query($query);
if (!$row=mysql_fetch_array($result))   // no records returned
        echo "";
else {
        echo $row['Address1']." ".$row['Zipcode'];
}
exit;
?>
4

1 回答 1

0

正如所承诺的,这是我能够开始工作的代码。

getGmap.php 代码

<?php require('constants.php');?>
<?php require('sessionHandler.php');?>
<?php require('dbHandler.php');?>
<?php require('getaddress.php');?>

<?php

if (!isset($_GET['cid']) || empty($_GET['cid']))
     die('No company specified.');
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"  xmlns:v="urn:schemas-microsoft-com:vml">
  <head>
    <title>Driving Directions to Customer provided by Google Maps</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
        <link type="text/css" href="./lib/default.css" rel="stylesheet">

        <script type="text/javascript"
           src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCnWPIRN8X0gLNqz-c1d87gv84CwZDuzjc&sensor=false"></script>

        <script>

                function process(){
                        //Main processing starts here.
                        //call getAddress. When AJAX call completes it will call inititalizeMap() to show the map.
                        getAddress();
                }


        //*** Begin AJAX***
        var req;                //global http request object

        function getAddress(){
                var url="getaddress.php?ajax=1&cid=<?php echo $_GET['cid'];?>";

                if (window.XMLHttpRequest) {    // IE/Windows ActiveX version
                req = new XMLHttpRequest();
                req.onreadystatechange = processReqChange;
                req.open("GET", url, true);
                req.send(null);
          }
          else if (window.ActiveXObject) {
                req = new ActiveXObject("Microsoft.XMLHTTP");
                if (req) {
                    req.onreadystatechange = processReqChange;
                    req.open("GET", url, true);
                    req.send();
                }
          }
          return true;
        }

        function processReqChange()
        {
            // only if req shows "complete"
            if (req.readyState == 4) {  //4=completed
                // only if "OK"
                if (req.status == 200) {        //200=OK, so processing data
                    //alert(req.responseText);

                    //parse XML
                    //var response  = req.responseXML.documentElement;
                                toAddress=req.responseText;
                                document.getElementById('addressSpan').innerHTML=" - "+toAddress;
                                initializeMap();
                }
                else {
                    alert("There was a problem retrieving the XML data:\n" + req.statusText);
                }
            }
        }
        //****** End AJAX ***
    </script>
  </head>

  <body onload="process()">
        <font class="normalText"><b>
        Directions to: <?php echo $_GET["cid"]. "-". getAddress($_GET["cid"]); ?>
        <span id="addressSpan"></span>
        from: My Office - 1234 Easy Street
        </b></font>
        <br />
        <font class="normalText10">
        <div style="width: 600px;">
             <div id="map" style="width: 280px; height: 400px; float: left;"></div>
             <div id="panel" style="width: 300px; float: right;"></div>
        </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('panel'));

             var route = {
               origin: '1234 Easy Street',
               destination: '<?php echo getAddress($_GET["cid"]); ?>',
               travelMode: google.maps.DirectionsTravelMode.DRIVING
             };

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

getaddress.php 代码

<?php

    function getAddress($cid) {

            //we only pass 5 chars of short id - actual id may be longer
            $query="select Address1, City, State, Zipcode from companies where CompanyShortID like '" . $cid . "%'";

            dbConnect();
            $result=mysql_query($query);
            if (!$row=mysql_fetch_array($result))   // no records returned
                            return "Company Not Found";
            else {
                            return $row['Address1']." ".$row['Zipcode'];
            }

            return "Company Not Found";
    }

?>
于 2013-10-02T10:08:28.973 回答