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>