Merhaba api bağlantısı yaptırdım düzgün çalışır vaziyette teslim aldım istediğim gibi verileri çekiyordu sistem hiç bir değişiklik yapmadım fakat veriler gelmiyor tablo oluşmuyor sorun neden kaynaklanıyor olabilir yapıda mı sorun var anlayan arkadaşlar bakabilirler mi
bağlantıyı yapan arkadaş mesajlarıma cevap vermiyor.

<div id="analyticsChartContainer">
        <canvas id="analyticsChart"></canvas>
    </div>

   <script>
   // API'den alınan verileri kullanarak grafik oluştur
function createChart(data) {
    var labels = data.map(function(item) {
        return item.date;
    });

    var values = data.map(function(item) {
        return item.users;
    });

    var ctx = document.getElementById('analyticsChart').getContext('2d');
    var chart = new Chart(ctx, {
        type: 'line',
        data: {
            labels: labels,
            datasets: [{
                label: 'Ziyaretçiler',
                data: values,
                backgroundColor: 'rgba(75, 192, 192, 0.2)',
                borderColor: 'rgba(75, 192, 192, 1)',
                borderWidth: 1
            }]
        },
        options: {
            scales: {
                y: {
                    beginAtZero: true,
                    max: 1000
                }
            }
        }
    });
}

// API'den verileri çek
function fetchData(startDate, endDate) {
        var accessToken = 'ya29.a0AWY7Ckmh77ldC78RSp7IxhGgsj9KFVbKi-HmEbxuOWyWvbm6hhFvGkjD4-d9x9MK7YhyrFsBkve_L1PmlR_3p9dkSrZA_I3mDcy3moS7fwHAegHAx1NsJERacHISLRC6QXGXsJdQwFub9fA2XUSMTaj33eWwaCgYKAQMSARASFQG1tDrpSCj09unSer-O4bAp_yKydQ0163';
    var viewId = '292159236';

    var url = 'https://www.googleapis.com/analytics/v3/data/ga';
    var data = {
        'ids': 'ga:' + viewId,
        'start-date': startDate,
        'end-date': endDate,
        'metrics': 'ga:users',
        'dimensions': 'ga:month'
    };

    var headers = {
        'Authorization': 'Bearer ' + accessToken
    };

    return fetch(url + '?' + new URLSearchParams(data), {
        headers: headers
    })
    .then(response => response.json())
    .then(responseData => {
        var data = responseData.rows.map(function(row) {
            return {
                date: getMonthName(row[0]),
                users: parseInt(row[1])
            };
        });

        createChart(data);
        
        return data;
    })
    .catch(error => {
        console.error('API Hatası:', error);
    });
}

// Ay numarasını ay ismiyle değiştir
function getMonthName(monthNumber) {
    var monthNames = [
        'Ocak', 'Şubat', 'Mart', 'Nisan', 'Mayıs', 'Haziran',
        'Temmuz', 'Ağustos', 'Eylül', 'Ekim', 'Kasım', 'Aralık'
    ];

    return monthNames[monthNumber - 1];
}

// Tarih formatını dönüştür
function formatDate(date) {
    var year = date.getFullYear();
    var month = ('0' + (date.getMonth() + 1)).slice(-2);
    var day = ('0' + date.getDate()).slice(-2);

    return year + '-' + month + '-' + day;
}

// Tüm Aylar butonuna tıklandığında verileri çek
$('#allMonthsBtn').on('click', function() {
    fetchData('2023-01-01', '2023-12-31');
});

// Son 3 Ay butonuna tıklandığında verileri çek
$('#lastThreeMonthsBtn').on('click', function() {
    var today = new Date();
    var currentMonth = today.getMonth() + 1;
    var currentYear = today.getFullYear();

    var startDate = new Date(currentYear, currentMonth - 3, 1);
    var endDate = new Date(currentYear, currentMonth, 0);

    fetchData(formatDate(startDate), formatDate(endDate));
});

// Bu Ay butonuna tıklandığında verileri çek
$('#thisMonthBtn').on('click', function() {
    var today = new Date();
    var currentMonth = today.getMonth() + 1;
    var currentYear = today.getFullYear();

    var startDate = new Date(currentYear, currentMonth - 1, 1);
    var endDate = new Date(currentYear, currentMonth, 0);

    fetchData(formatDate(startDate), formatDate(endDate));
});

// Sayfa yüklendiğinde verileri çek ve grafik oluştur
document.addEventListener('DOMContentLoaded', function() {
    fetchData('2023-01-01', '2023-12-31');
    
    // Bugün, Dün ve Son 7 Gün verilerini çek ve divlere yazdır
    var today = new Date();
    var yesterday = new Date(today);
    yesterday.setDate(yesterday.getDate() - 1);
    var startDate = new Date(today);
    startDate.setDate(startDate.getDate() - 6);
    

    var formattedToday = formatDate(today);
    var formattedYesterday = formatDate(yesterday);
    var formattedStartDate = formatDate(startDate);

    fetchData(formattedToday, formattedToday).then(function(data) {
        $('#todayUsers').text(data[0].users);
    });

    fetchData(formattedYesterday, formattedYesterday).then(function(data) {
        $('#yesterdayUsers').text(data[0].users);
    });

    fetchData(formattedStartDate, formattedToday).then(function(data) {
        var totalUsers = data.reduce(function(acc, curr) {
            return acc + curr.users;
        }, 0);
        $('#lastSevenDaysUsers').text(totalUsers);
    });
});

// API'den alınan verileri kullanarak grafik oluştur
function createChart(data) {
    var labels = data.map(function(item) {
        return item.date;
    });

    var values = data.map(function(item) {
        return item.users;
    });

    var ctx = document.getElementById('analyticsChart').getContext('2d');
    var chart = new Chart(ctx, {
        type: 'line',
        data: {
            labels: labels,
            datasets: [{
                label: 'Ziyaretçiler',
                data: values,
                backgroundColor: 'rgba(75, 192, 192, 0.2)',
                borderColor: 'rgba(75, 192, 192, 1)',
                borderWidth: 1
            }]
        },
        options: {
            scales: {
                y: {
                    beginAtZero: true,
                    max: 1000
                }
            }
        }
    });
}

   // API'den verileri çek
    function fetchData(startDate, endDate) {
        var accessToken = 'ya29.a0AWY7Ckmh77ldC78RSp7IxhGgsj9KFVbKi-HmEbxuOWyWvbm6hhFvGkjD4-d9x9MK7YhyrFsBkve_L1PmlR_3p9dkSrZA_I3mDcy3moS7fwHAegHAx1NsJERacHISLRC6QXGXsJdQwFub9fA2XUSMTaj33eWwaCgYKAQMSARASFQG1tDrpSCj09unSer-O4bAp_yKydQ0163';
        var viewId = '292159236';

        var url = 'https://www.googleapis.com/analytics/v3/data/ga';
        var data = {
            'ids': 'ga:' + viewId,
            'start-date': startDate,
            'end-date': endDate,
            'metrics': 'ga:users',
            'dimensions': 'ga:month'
        };

        var headers = {
            'Authorization': 'Bearer ' + accessToken
        };

        return fetch(url + '?' + new URLSearchParams(data), {
            headers: headers
        })
        .then(response => response.json())
        .then(responseData => {
            var data = responseData.rows.map(function(row) {
                return {
                    date: row[0],
                    users: parseInt(row[1])
                };
            });
            return data;
        });
    }

// Ay numarasını ay ismiyle değiştir
function getMonthName(monthNumber) {
    var monthNames = [
        'Ocak', 'Şubat', 'Mart', 'Nisan', 'Mayıs', 'Haziran',
        'Temmuz', 'Ağustos', 'Eylül', 'Ekim', 'Kasım', 'Aralık'
    ];

    return monthNames[monthNumber - 1];
}

// Tarih formatını dönüştür
function formatDate(date) {
    var year = date.getFullYear();
    var month = ('0' + (date.getMonth() + 1)).slice(-2);
    var day = ('0' + date.getDate()).slice(-2);

    return year + '-' + month + '-' + day;
}

// Sayfa yüklendiğinde verileri çek ve grafik oluştur
document.addEventListener('DOMContentLoaded', function() {
    fetchData('2023-01-01', '2023-12-31')
        .then(function(data) {
            // Tüm Aylar butonuna "active" sınıfını ekle
            $('#allMonthsBtn').addClass('active');
            // Grafik oluştur
            createChart(data);
        })
        .catch(function(error) {
            console.error('Veri alınamadı:', error);
        });

    // Bugün, Dün ve Son 7 Gün verilerini çek ve divlere yazdır
    var today = new Date();
    var yesterday = new Date(today);
    yesterday.setDate(yesterday.getDate() - 1);
    var startDate = new Date(today);
    startDate.setDate(startDate.getDate() - 6);

    var formattedToday = formatDate(today);
    var formattedYesterday = formatDate(yesterday);
    var formattedStartDate = formatDate(startDate);

    fetchData(formattedToday, formattedToday).then(function(data) {
        document.getElementById('today').textContent = data[0].users;
    });

    fetchData(formattedYesterday, formattedYesterday).then(function(data) {
        document.getElementById('yesterday').textContent = data[0].users;
    });

    fetchData(formattedStartDate, formattedToday).then(function(data) {
        var totalUsers = data.reduce(function(acc, curr) {
            return acc + curr.users;
        }, 0);
        document.getElementById('lastSevenDays').textContent = totalUsers;
    });

    // Gerçek Zamanlı Aktif Ziyaretçi sayısını güncelle
    function fetchRealTimeActiveVisitors() {
        var accessToken = 'ya29.a0AWY7Ckmh77ldC78RSp7IxhGgsj9KFVbKi-HmEbxuOWyWvbm6hhFvGkjD4-d9x9MK7YhyrFsBkve_L1PmlR_3p9dkSrZA_I3mDcy3moS7fwHAegHAx1NsJERacHISLRC6QXGXsJdQwFub9fA2XUSMTaj33eWwaCgYKAQMSARASFQG1tDrpSCj09unSer-O4bAp_yKydQ0163';

        var url = 'https://www.googleapis.com/analytics/v3/data/realtime';
        var data = {
            'ids': 'ga:292159236',
            'metrics': 'ga:activeVisitors',
            'access_token': accessToken
        };

        return fetch(url + '?' + new URLSearchParams(data))
            .then(response => response.json())
            .then(responseData => {
                var activeVisitorsCount = responseData.totalsForAllResults['ga:activeVisitors'];
                return activeVisitorsCount || 0;
            })
            .catch(error => {
                console.error('API Hatası:', error);
                return 0;
            });
    }

    $(document).ready(function() {
        // İlk çağrıyı yap
        fetchRealTimeActiveVisitors().then(function(activeVisitorsCount) {
            $('#activeVisitors').text(activeVisitorsCount || 0);
        });

        // 5 saniyede bir güncelleme yap
        setInterval(function() {
            fetchRealTimeActiveVisitors().then(function(activeVisitorsCount) {
                $('#activeVisitors').text(activeVisitorsCount || 0);
            });
        }, 5000); // 5 saniye (5000 milisaniye)
    });
});
</script>