多個標記未顯示在Google地圖上

Question

我是Web開發的新手。 對於我的論文項目，我必須在Google地圖上使用標記。 我想從sql數據庫中獲取經度和緯度，並使用jason解析和JS，我想在Google地圖上放置多個標記。 但標記未顯示在地圖上。 我不明白我的錯誤在哪里。 請讓我知道解決方案。 完整代碼如下。

`

$sql = "SELECT * FROM potholes";
$data = mysqli_query($db->getDb(), $sql);

foreach ($data as $key)
{
            $locations[]=array( 'name'=>'Potholes', 'lat'=>$key['lat_p'], 'lng'=>$key['longi_p'] );
}
/* Convert data to json */
$markers = json_encode( $locations );

？>

<html>
  <head>
    <style>
      #map {
        height: 400px;
        width: 100%;
       }
    </style>
  </head>
  <body>
    <h3>My Google Maps Demo</h3>
    <div id="map"></div>
    <script type='text/javascript'>
    <?php
        echo "var markers=$markers;\n";
    ?>

    function initMap() {

        var latlng = new google.maps.LatLng(23.7654627,90.4373187); // default location
        var myOptions = {
            zoom: 14,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            mapTypeControl: false
        };

        var map = new google.maps.Map(document.getElementById('map'),myOptions);
        var infowindow = new google.maps.InfoWindow();
        var json=JSON.parse( markers );
        length = json.length;
    for (var i = 0; i < length; i++) 

        {
            var data = json[i],
                latLng = new google.maps.LatLng(data.lat, data.lng);

            var marker = new google.maps.Marker({
                position: latLng,
                map: map,
                title: data.name
            });


            (function(marker, data) {
                google.maps.event.addListener(marker, "click", function(e) {
                    infoWindow.setContent(data.name);
                    infoWindow.open(map, marker);
                });


            })(marker, data);

      }
    }
    </script>

    <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyACIJl5Uv3RD1vvQJmlXTToi9THhUpQXxU&callback=initMap"
    type="text/javascript"></script>
  </body>
</html>`

Answer 1

你有這個：

<?php
    echo "var markers=$markers;\n";
?>

由於$markers是JSON，因此您無需解析它。 更換

var json=JSON.parse( markers );

同

var json = markers;

至於infoWindow ，添加

let infoWindow = new google.maps.InfoWindow();

在設置內容之前。

多個標記未顯示在Google地圖上

問題描述

1 個解決方案

解決方案1
0 已采納 2017-06-02 18:39:17

多個標記未顯示在Google地圖上

問題描述

1 個解決方案

解決方案1 0 已采納 2017-06-02 18:39:17

解決方案1
0 已采納 2017-06-02 18:39:17