谷歌地图上的xml标记显示问题

时间:2016-05-22 23:45:37

标签: php xml google-maps web google-maps-markers

我尝试将多个标记从sql数据库表显示到谷歌地图。我已经将数据转换为XML格式,可以在地图上迭代成多个标记,但这是我收到问题的地方。

我已经设法做了一次,但是当我尝试在地图上添加另一个标记表时遇到问题。它不是两组相似的代码相同,只是这段代码在某处错了,我无法在任何地方看到它。

您在下面看到的是2个函数,用于在地图上迭代并标记它们。

以下功能有效:

downloadUrl("php/setMarkers.php");

但是以下没有:

downloadUrl("php/sethospMarkers.php");

两个XML文档都被调用,并且响应在Google控制台中显示正常,并且两者完全相同,因此没有区别。即使我删除" setMarkers"功能超出应用程序我无法得到这个" hospmarkers"功能工作。这个功能有什么问题?我只是累了,错过了基础知识?

Chrome显示的与此问题相关的错误之一是:

Uncaught TypeError: Cannot read property 'documentElement' of null

进行以下调用

var markers = xml.documentElement.getElementsByTagName("marker");

在医院的功能

 function initialize() {
        var bournemouth = new google.maps.LatLng(50.86244, -1.24778);
        var myOptions = {
            center: bournemouth,
            zoom: 10,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        var infoWindow = new google.maps.InfoWindow; 
        downloadUrl("php/setMarkers.php", function(data) {
          var xml = data.responseXML;
          var markers = xml.documentElement.getElementsByTagName("marker");
          for (var i = 0; i < markers.length; i++) {
          var name = markers[i].getAttribute("name");
          var acronym = markers[i].getAttribute("acronym");
          var point = new google.maps.LatLng(
            parseFloat(markers[i].getAttribute("lat")),
            parseFloat(markers[i].getAttribute("lng")));
          var html = "<b>" + name + "</b> <br/>" + acronym;
          var marker = new google.maps.Marker({
          map: map,
          position: point,
          icon: "img/bus.png"
        });
        bindInfoWindow(marker, map, infoWindow, html);
      }
    });

        downloadUrl("php/sethospMarkers.php", function(data) {
          var xml = data.responseXML;
          var markers = xml.documentElement.getElementsByTagName("marker");
          for (var i = 0; i < markers.length; i++) {
          var point = new google.maps.LatLng(
            parseFloat(markers[i].getAttribute("lat")),
            parseFloat(markers[i].getAttribute("lng")));
          var name = markers[i].getAttribute("name");
          var phone = markers[i].getAttribute("phone");
          var html = "<b>" + name + "</b> <br/>" + phone;
          var marker = new google.maps.Marker({
          map: map,
          position: point,
          icon: "img/hospital-building.png"
        });
        bindInfoWindow(marker, map, infoWindow, html);
      }
    });
           function bindInfoWindow(marker, map, infoWindow, html) {
      google.maps.event.addListener(marker, 'click', function() {
        infoWindow.setContent(html);
        infoWindow.open(map, marker);
      });
    }
    function downloadUrl(url,callback) {
         var request = window.ActiveXObject ?
             new ActiveXObject('Microsoft.XMLHTTP') :
             new XMLHttpRequest;

         request.onreadystatechange = function() {
           if (request.readyState == 4) {
             request.onreadystatechange = doNothing;
             callback(request, request.status);
           }
         };

         request.open('GET', url, true);
         request.send(null);
        }

    function doNothing() {}

下面的脚本是我用来准备数据的xml转换器,你可以看到它非常简单。这是针对医院的标记。

   <?php
require("sql_dbinfo.php");

function parseToXML($htmlStr)
{
$xmlStr=str_replace('<','&lt;',$htmlStr);
$xmlStr=str_replace('>','&gt;',$xmlStr);
$xmlStr=str_replace('"','&quot;',$xmlStr);
$xmlStr=str_replace("'",'&#39;',$xmlStr);
$xmlStr=str_replace("&",'&amp;',$xmlStr);
return $xmlStr;
}

// Opens a connection to a MySQL server
$connection=mysqli_connect ('localhost', $username, $password);
if (!$connection) {
  die('Not connected : ' . mysql_error($connection));
}

// Set the active MySQL database
$db_selected = mysqli_select_db($connection, $database);
if (!$db_selected) {
  die ('Can\'t use db : ' . mysqli_error($connection));
}

// Select all the rows in the markers table
$query = "SELECT * FROM hospmarkers WHERE 1";
$result = mysqli_query($connection, $query);
if (!$result) {
  die('Invalid query: ' . mysqli_error($connection));
}

header("Content-type: text/xml");

// Start XML file, echo parent node
echo '<markers>';

// Iterate through the rows, printing XML nodes for each
while ($row = @mysqli_fetch_assoc($result)){
  // ADD TO XML DOCUMENT NODE
  echo '<marker ';
  echo 'lat="' . $row['lat'] . '" ';
  echo 'lng="' . $row['lng'] . '" ';
  echo 'name="' . $row['name'] . '" ';
  echo 'phone="' . $row['phone'] . '" ';
  echo '/>';
}

// End XML file
echo '</markers>';

?>`

sethospmarkers的回应如下。

"<markers><marker lat="53.853" lng="-0.411" name="East Riding Community Hospital" phone="01482 886600" /><marker lat="50.807" lng="-0.500" name="Zachary Merton Community Hospital " phone="01903 858100" /><marker lat="51.140" lng="-0.486" name="Musculoskeletal physiotherapy service - Cranleigh Village Hospital" phone="01483 782400" /><marker lat="51.380" lng="-0.406" name="Walton Community Hospital" phone="01932 414205" /><marker lat="51.315" lng="-0.556" name="Woking Community Hospital (Virgin Care)" phone="01483 715911" />

` 我在做一些傻事吗?或者我有语法问题? 先谢谢

1 个答案:

答案 0 :(得分:0)

正如Molle博士建议的那样。

名称和电话属性必须使用函数parseToXML

  echo 'name="' . parseToXML($row['name']) . '" ';
  echo 'phone="' . parseToXML($row['phone']) . '" ';

如上所示。

谢谢Molle。