Selamlar , sistem Boğaziçi Universitesinden anlık olarak çekiyor.


<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Depremler</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
</head>
<body>
    <div class="container mt-4">
        <h2>Depremler</h2>
        <div class="form-group">
            <label for="citySelect">Şehir Seç:</label>
            <select class="form-control" id="citySelect">
                <option value="istanbul">İstanbul</option>
                <!-- Diğer şehirler buraya eklenebilir -->
            </select>
        </div>
        <button class="btn btn-primary mb-2" onclick="refreshData()">Yenile</button>
        <div id="depremContent" class="alert alert-info"></div>
    </div>
  
    <script>
        // Fonksiyonlar
        function refreshData() {
            var selectedCity = document.getElementById('citySelect').value;
            fetchData(selectedCity);
        }
 
        function fetchData(city) {
            fetch('https://earthquake.usgs.gov/fdsnws/event/1/query?format=geojson&minmagnitude=2&orderby=time&limit=10&starttime=2000-01-01&endtime=2024-05-26&maxradiuskm=100&' + city)
                .then(response => response.json())
                .then(data => {
                    if (data.features && data.features.length > 0) {
                        var earthquakeList = '<ul>';
                        data.features.forEach(feature => {
                            var place = feature.properties.place;
                            var magnitude = feature.properties.mag;
                            earthquakeList += '<li>' + place + ' - Magnitude: ' + magnitude + '</li>';
                        });
                        earthquakeList += '</ul>';
                        document.getElementById('depremContent').innerHTML = earthquakeList;
                    } else {
                        document.getElementById('depremContent').innerHTML = '<div class="alert alert-danger">Deprem bulunamadı.</div>';
                    }
                })
                .catch(error => {
                    document.getElementById('depremContent').innerHTML = '<div class="alert alert-danger">Veri çekme hatası.</div>';
                });
        }
 
        // İlk veri yükleme
        fetchData('latitude=41.0082&longitude=28.9784');
    </script>
</body>
</html>