Merhaba arkadaşlar. Veritabanına kaydettiğim koordinatları işaretleyici ile harita üzeride gösteremiyorum. Chrome konsolunu açtığımda da iki sorun ile karşılaşıyorum.

Koordinatları çekerken hata oluştu: 
SyntaxError: Unexpected token 
<!DOCTYPE  ... is not valid JSON

İkinci hata faturalandırma yapmamı istiyor. Yalnız ben 18 bin gibi bir görüntüleme yapmadım. Bu sayılara kadar ücretsiz olması gerekli.

Kodlar aşağıda.

<div class="konum">
    <?php
    $genelbilgilersorgusu = "SELECT * FROM yenieklenenler WHERE yenieklenenler_id='$sayfaal'";
    $genelbilgilersorgu = mysqli_query($db, $genelbilgilersorgusu);
    foreach($genelbilgilersorgu as $genelbilgilersorgugoster) {
    ?>
        <div id="map" style="height: 400px; width: 100%;">
            <?php $coordinates[] = array($genelbilgilersorgugoster['yenieklenenler_latitude'], $genelbilgilersorgugoster['yenieklenenler_longitude']); ?>
        </div>
    
    
    <?php } 
    json_encode($coordinates);
    ?>

<script>
    var map;
    var marker;

    function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
            center: {lat: 41.0082, lng: 28.9784},
            zoom: 6
        });

        fetch('yenieklenensayfasi.php')
            .then(response => response.json())
            .then(coordinates => {
                coordinates.forEach(coord => {
                    var newMarker = new google.maps.Marker({
                        position: {lat: parseFloat(coord.lat), lng: parseFloat(coord.lng)},
                        map: map
                    });
                });
            })
            .catch(error => {
                console.error('Koordinatları çekerken hata oluştu:', error);
            });

        map.addListener('click', function(event) {
            placeMarker(event.latLng);
        });
    }

    function placeMarker(location) {
        if (marker) {
            marker.setPosition(location);
        } else {
            marker = new google.maps.Marker({
                position: location,
                map: map
            });
        }

        document.getElementById('latitude').value = location.lat();
        document.getElementById('longitude').value = location.lng();
    }
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=apikey&loading=async&callback=initMap" async defer></script>