Question

我有一些代码可以查询我的数据库并返回地址数据。然后我将地址转换为json格式的纬度和经度，以便我可以使用javascript函数在谷歌地图上显示标记。总体结果是关于json数据的意外结束的错误代码。我相信问题出在php文件中。当我在它自己运行时，我得到一个破坏的页面响应。有谁知道为什么我会收到错误？

这是php代码：

$address = pg_query($conn, "
SELECT 
  incident.address,
  incident.city,
  incident.state_1
FROM 
  fpscdb001_ws_001.incident
WHERE
  incident.initial_symptom = 'Chrome Upgrade' AND
  incident.is_installed != 'true';");

  if (!$address) {
          echo "Query failed\n";
          exit;
        }
$arr = array();
while ($markers = pg_fetch_row($address)){
  $Lat = $xml->result->geometry->location->lat;
  $Lon = $xml->result->geometry->location->lng;
  $arr[] = array("lat" => $Lat, "lng" => $Lng);
}
echo json_encode($arr);

  }
pg_close($conn);

这是javascript：

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
    var arr = JSON.parse(xhr.responseText);
    if(Array.isArray(arr)){
        showMarkers(arr);
    }
}
}
xhr.open('GET', 'markers.php', true);
xhr.send();

function showMarkers(locations){
var markers = locations.map(function(location, i) {
  return new google.maps.Marker({
    position: location,
    label: labels[i % labels.length]
  });
});

var markerCluster = new MarkerClusterer(map, markers, {imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'});}}

控制台：未捕获的SyntaxError：JSON输入的意外结束在JSON.parse（）在XMLHttpRequest.xhr.onreadystatechange（map.php：36）

Answer 1

你正在使用$ Ln：$ Ln：

  $Lon = $xml->result->geometry->location->lng;
  $arr[] = array("lat" => $Lat, "lng" => $Lng);

此外，问题标题是错误的：你想要json数组，而不是xml数组

Answer 2

示例代码，请测试。

markers.php

<?php

$p =   [

        ['lat'=>-37.774785, 'lng'=> 145.137978],
        ['lat'=>-37.819616, 'lng'=> 144.968119],
        ['lat'=>-38.330766, 'lng'=> 144.695692],
        ['lat'=>-39.927193, 'lng'=> 175.053218],
        ['lat'=>-41.330162, 'lng'=> 174.865694],
        ['lat'=>-42.734358, 'lng'=> 147.439506],
        ['lat'=>-42.734358, 'lng'=> 147.501315],

      ];

echo json_encode($p);

markers.html

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>Marker Clustering</title>
    <style>
      /* Always set the map height explicitly to define the size of the div
       * element that contains the map. */
      #map {
        height: 100%;
      }
      /* Optional: Makes the sample page fill the window. */
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>

<script>
function initMap() {

       var map = new google.maps.Map(document.getElementById('map'), {
          zoom: 3,
          center: {lat: -28.024, lng: 140.887}
        });

        var labels = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';

        var markers = locations.map(function(location, i) {
          return new google.maps.Marker({
            position: location,
            label: labels[i % labels.length]
          });
        });

        // Add a marker clusterer to manage the markers.
        var markerCluster = new MarkerClusterer(map, markers,
            {imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'});
      }

var locations;
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
    var arr = JSON.parse(xhr.responseText);
    if(Array.isArray(arr)){
      locations = arr;
    }
  }
}
xhr.open('GET', 'markers.php', true);
xhr.send();

  </script>
  <script src="https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/markerclusterer.js"></script>
   <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAkUrEm_U0QWg1QNryI1O5FpB0xAvffJ7I&callback=initMap"></script>
 </body>
</html>

或两种方法：

markers.php

<?php

$p =   [

        ['lat'=>-37.774785, 'lng'=> 145.137978],
        ['lat'=>-37.819616, 'lng'=> 144.968119],
        ['lat'=>-38.330766, 'lng'=> 144.695692],
        ['lat'=>-39.927193, 'lng'=> 175.053218],
        ['lat'=>-41.330162, 'lng'=> 174.865694],
        ['lat'=>-42.734358, 'lng'=> 147.439506],
        ['lat'=>-42.734358, 'lng'=> 147.501315],

      ];

return json_encode($p);

markers_html.php

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>Marker Clustering</title>
    <style>
      /* Always set the map height explicitly to define the size of the div
       * element that contains the map. */
      #map {
        height: 100%;
      }
      /* Optional: Makes the sample page fill the window. */
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>


<script>
function initMap() {

       var map = new google.maps.Map(document.getElementById('map'), {
          zoom: 3,
          center: {lat: -28.024, lng: 140.887}
        });

        var labels = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';

        var markers = locations.map(function(location, i) {
          return new google.maps.Marker({
            position: location,
            label: labels[i % labels.length]
          });
        });

        // Add a marker clusterer to manage the markers.
        var markerCluster = new MarkerClusterer(map, markers,
            {imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'});
      }

var locations = <?=include("markers.php");?>;

  </script>
  <script src="https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/markerclusterer.js"></script>
   <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAkUrEm_U0QWg1QNryI1O5FpB0xAvffJ7I&callback=initMap"></script>
 </body>
</html>

PHP将数据从查询转换为json数组

2 个答案: