Javascript 如何从SQL数据库添加google地图标记

我有一个谷歌地图，我想为我在数据库中添加的每个元素（纬度和经度）添加一个新的标记。 这就是我所做的不起作用的事情。 谢谢你的帮助

<?php
    $reponse = $bdd->query('SELECT * FROM zdou ORDER BY id ');
    while ($donnees = $reponse->fetch()){

    ?>
        <p>
            <strong>latitude</strong> : <?php echo $donnees['latitude']; ?><br/>
            <strong>longitude</strong> : <?php echo $donnees['longitude']; ?><br/>
        </p>
        <?php
            $latitude = $donnees['latitude'];
            $longitude = $donnees['longitude'];
        ?>
        <script>
            latitude = <?php echo $latitude ?>;
            longitude = <?php echo $longitude ?>;
            marker = new google.maps.LatLng(latitude, longitude);
            var placerMarker = new google.maps.Marker({position:marker,map:map,title:"Zdou"});
        </script>
        <?php
    }
    $reponse->closeCursor();
        ?>

编辑： 我创建了一个变量，该变量每次进入while循环中的“脚本”时都会递增，然后显示该变量。 猜怎么着，变量未定义，因此循环中的脚本未被读取。

---

还需要一些帮助

尝试将地图变为全局变量。因为在php循环中创建标记时没有定义它

var map;
function showPosition(position) {
    lat = position.coords.latitude;
    lon = position.coords.longitude;
    latlon = new google.maps.LatLng(lat, lon)
    mapholder = document.getElementById('mapholder')
    mapholder.style.height = '250px';
    mapholder.style.width = '500px';

    var myOptions = {
    center:latlon,zoom:12,
    mapTypeId:google.maps.MapTypeId.ROADMAP,
    mapTypeControl:false,
    navigationControlOptions:{style:google.maps.NavigationControlStyle.SMALL}
    }
    map = new google.maps.Map(document.getElementById("mapholder"), myOptions);
    var myPos = new google.maps.Marker({position:latlon,map:map,title:"You are here!"});

}

---

再看看这个

它没有解决这个问题，标记仍然不存在。但它解决了我数据库的另一个问题。我现在会尝试理解你的链接，谢谢

var map;
function showPosition(position) {
    lat = position.coords.latitude;
    lon = position.coords.longitude;
    latlon = new google.maps.LatLng(lat, lon)
    mapholder = document.getElementById('mapholder')
    mapholder.style.height = '250px';
    mapholder.style.width = '500px';

    var myOptions = {
    center:latlon,zoom:12,
    mapTypeId:google.maps.MapTypeId.ROADMAP,
    mapTypeControl:false,
    navigationControlOptions:{style:google.maps.NavigationControlStyle.SMALL}
    }
    map = new google.maps.Map(document.getElementById("mapholder"), myOptions);
    var myPos = new google.maps.Marker({position:latlon,map:map,title:"You are here!"});

}