Question

有人可以帮忙吗？：）

1）首先，我获得了geoloc功能的用户坐标 2）我将这些坐标与数据库商店进行比较，找到最近的并得到商店的坐标 3）我想用中间的引脚显示谷歌地图

但是我收到too much recursion错误，并且想知道如何设置ajax返回，因为如果我直接添加positionmagasin = new google.maps.LatLng(45.764043,4.835659);而不是positionmagasin = new google.maps.LatLng(coordonnees);，那么效果很好......

感谢您的回答！

这是我的HTML和脚本：

    <!-- Un élément HTML pour recueillir l’affichage -->
    <div id="infoposition"></div>

    <div id="map"></div>

    <script type="text/javascript">
        // Récupère tous les coordonnées des magasins
        function getMarkers(map) {
            var magasins = new Array;
            <?php 
                $querymag = mysql_query("SELECT * FROM magasins");
                $nbmag = mysql_num_rows($querymag);
                if($nbmag > 0){
                    while($rowmag = mysql_fetch_array($querymag)){
                        $mag_id = $rowmag['id_magasins'];
                        $mag_titre = $rowmag['titre_magasins'];
                        $mag_lat = $rowmag['lat_magasins'];
                        $mag_lng = $rowmag['lng_magasins'];
                    ?>
                        var intermediaire = new Array('<?php echo $mag_id;?>','<?php echo $mag_titre;?>','<?php echo $mag_lat;?>','<?php echo $mag_lng;?>');
                        magasins.push(intermediaire);
                    <?php 
                    }
                }
            ?>
            setMarkers(map, magasins);
        }

        // Place les markers sur la carte
        function setMarkers(map, locations) {
            for (var i = 0; i < locations.length; i++) {
                var magasins = locations[i];
                //console.log(magasins);
                var myLatLng = new google.maps.LatLng(magasins[2], magasins[3]);
                var infoWindow = new google.maps.InfoWindow();
                var marker = new google.maps.Marker({
                    position: myLatLng,
                    map: map,
                    animation: google.maps.Animation.DROP,
                });
                (function(i) {
                    google.maps.event.addListener(marker, "click", function() {
                        var magasins = locations[i];
                        infoWindow.close();
                        infoWindow.setContent(
                            "<div id='boxcontent' style='font-family:Calibri'><strong style='color:green'>"
                            + magasins[1] +
                            "</strong><br /><span style='font-size:12px;color:#333'>Ceci est un test.</span></div>"
                        );
                        infoWindow.open(map, this);
                    });
                })(i);
            }
        }

        function maPosition(position) {
            // Récupère les coordonnées de l'utilisateur
            var x = position.coords.latitude;
            var y = position.coords.longitude;

            // Lance la fonction de calcul SQL pour trouver les coordonnées du magasin le + proche
            var request = $.ajax({
                url: 'fichier2.php',
                type: 'GET',
                data: { 
                    action: 'position',
                    lat: x,
                    lng: y
                }
            });

            request.done(function(retourAjax){
                //donne les coordonnées du magasin en paramètre
                document.getElementById("infoposition").innerHTML = retourAjax;
                var coordonnees = retourAjax;
                //---------------- là ça bloque !!! ------------------ //
                positionmagasin = new google.maps.LatLng(coordonnees);
                // --------------------------------------------------- //

                map = new google.maps.Map(document.getElementById("map"), {
                    zoom: 7,
                    center: positionmagasin,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                });

                //centre la carte sur la position du magasin
                map.panTo(positionmagasin);
                getMarkers(map);
            });

            request.fail(function(retourAjax) {
                defPosition();
            });
        }

        // Affichage de la position par défaut en cas d'erreur
        function defPosition() {
            var info = "Erreur lors de la géolocalisation : Affichage par défaut";
            document.getElementById("infoposition").innerHTML = info;

            var latlng = new google.maps.LatLng(48.856614,2.352222);

            map = new google.maps.Map(document.getElementById("map"), {
                zoom: 7,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            });

            map.panTo(latlng);
            getMarkers(map);
        }

        // Fonction de callback en cas d’erreur
        function erreurPosition(error) {
            var info = "Erreur lors de la géolocalisation : ";
            switch(error.code) {
            case error.TIMEOUT:
                info += "Timeout !";
            break;
            case error.PERMISSION_DENIED:
                info += "Vous n’avez pas donné la permission // affichage de la position par défaut";
                defPosition();
            break;
            case error.POSITION_UNAVAILABLE:
                info += "La position n’a pu être déterminée";
                defPosition();
            break;
            case error.UNKNOWN_ERROR:
            info += "Erreur inconnue";
            break;
            }
            document.getElementById("infoposition").innerHTML = info;
        }

        // Tester si le navigateur est compatible et lancer la géolocalisation
        if(navigator.geolocation) {
            survId = navigator.geolocation.getCurrentPosition(maPosition,erreurPosition);
        } else {
            alert("Ce navigateur ne supporte pas la géolocalisation");
        }
    </script>

PHP：

<?php
include 'fonction/_connexion.php';

function Findmagasin($lat1, $lng1){
    $query = mysql_query("SELECT *, get_distance_metres($lat1, $lng1, lat_magasins, lng_magasins) AS proximite 
          FROM magasins WHERE get_distance_metres($lat1, $lng1, lat_magasins, lng_magasins) < 1000000 ORDER BY proximite ASC LIMIT 1");
        $nb = mysql_num_rows($query);
        if($nb = 1){
            $row = mysql_fetch_array($query);
            $id = $row['id_magasins'];
            $titre = $row['titre_magasins'];
            $x = $row['lat_magasins'];
            $y = $row['lng_magasins'];
            // coordonnées du magasin le plus proche

            echo $x.",".$y;
        } else {
            echo "48.856614,2.352222";
        }
}

// vérifier si une action à réaliser est transmise
if (isset($_GET['action'])) {

    // si oui réalise l'action
    $action = $_GET['action'];

    switch ($action) {
        case 'position':

            // verifie qu'un étudiant a bien été transmis
            if (isset($_GET['lat']) && isset($_GET['lng'])){
                $lat1 = $_GET['lat'];
                $lng1 = $_GET['lng'];
                Findmagasin($lat1, $lng1);
            } else {
                echo 'aucun ordre transmis';
            }
            break;
    }

} else {
    echo 'aucune action transmise';
} ?>

Answer 1

您写道：

但是我得到了太多的递归错误，...因为如果我直接添加positionmagasin = new google.maps.LatLng(45.764043,4.835659);而不是positionmagasin = new google.maps.LatLng(coordonnees);，那么效果很好......

google.maps.LatLng构造函数将2个数字作为参数，而不是单个参数。

如果coordonnees是数组，请执行此操作;

positionmagasin = new google.maps.LatLng(coordonnees[0],coordonnees[1]);

如果coordonnees是包含两个数值的逗号分隔字符串，请执行以下操作：

var coords = coordonnees.split(",");
positionmagasin = new google.maps.LatLng(parseFloat(coords[0]),parseFloat(coords[1]));

使用GMap API和Ajax对最近的商店进行地理标记

1 个答案: