我想使用数据库中的地图标记

时间:2017-08-31 11:50:46

标签: javascript jquery google-maps

我有一个谷歌地图,我想在我的数据库中添加一个新的标记,它具有纬度和经度,但它不起作用,我发现一些错误 " Uncaught SyntaxError:missing)参数列表" 请告诉我。感谢您的帮助。

<!DOCTYPE html>
<html>
  <head>
  <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>

    <style>
       #map {
        height: 400px;
        width: 100%;
       }
    </style>
  </head>
  <body>
    <h3>My Google Maps Demo</h3>
    <div id="map"></div>
    <script>
      function initMap() {
            var mapOptions = {
                center: {lat: 13.847860, lng: 100.604274},
                zoom: 10,
            }
            var map = new google.maps.Map(document.getElementById('map'),mapOptions); 
            var marker, info;
            $.getJSON( "jsondata.php", funtion(jsonObj){
                $.each(jsonObj, function(i, item){
                    marker = new google.maps.Marker({
                        position: new google.maps.LatLng(item.lat, item.lng),
                        map: maps,
                    });
                    info = new google.maps.Infowindow();
                    google.maps.event.addListener(marker, 'click', (function(marker, i){
                        return function() {
                            info.setContent(item.name);
                            info.open(maps, marker);
                        }
                    })(marker, i));
                });
            });       
        }
    </script>
    <script async defer
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA6oLvZzDHD-qxeX3g17_uHQMWXFXCxU30&callback=initMap">

    </script>
  </body>
</html>

和我的连接文件

<?php
header('Content-Type: application/json');
$objConnect = mysqli_connect("localhost","root","root","username-databasename");
$strSQL = "SELECT * FROM markers ";
$objQuery = mysqli_query($objConnect,$strSQL);
$resultArry = arry();
while($obResult = mysql_fetch_assoc($objQuery))
{
    array_push($resultArray,$obResult);
}
echo json_encode($resultArray);
?>

https://i.stack.imgur.com/CLvCe.png

2 个答案:

答案 0 :(得分:1)

第24行出错。它应该是这样的:

$.getJSON( "jsondata.php", funtion(jsonObj)){

答案 1 :(得分:1)

解决方案:

<!DOCTYPE html>
<html>
  <head>
  <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>

    <style>
       #map {
        height: 400px;
        width: 100%;
       }
    </style>
  </head>
  <body>
    <h3>My Google Maps Demo</h3>
    <div id="map"></div>
    <script>
      function initMap() {
            var mapOptions = {
                center: {lat: 13.847860, lng: 100.604274},
                zoom: 10,
            }
            var map = new google.maps.Map(document.getElementById('map'),mapOptions); 
            var marker, info;

            $.getJSON( "jsondata.php", function( jsonObj ) {
                $.each(jsonObj, function(i, item){
                    marker = new google.maps.Marker({
                        position: new google.maps.LatLng(item.lat, item.lng),
                        map: maps,
                    });
                    info = new google.maps.Infowindow();
                    google.maps.event.addListener(marker, 'click', (function(marker, i){
                        return function() {
                            info.setContent(item.name);
                            info.open(maps, marker);
                        }
                    })(marker, i));
                });
            }); 

        }
    </script>
    <script async defer
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA6oLvZzDHD-qxeX3g17_uHQMWXFXCxU30&callback=initMap">

    </script>
  </body>
</html>