simedkom/resources/views/dashboard/statistics/chart/website-visitor.blade.php
myqnrrhmn ae9d8cd908 feat: airing proof theme statistic
feat: content recap statistic

feat: cooperation completion

feat: user statistic

feat: website visitor statistic
2025-07-10 10:42:57 +07:00

86 lines
1.8 KiB
PHP

<script>
const monthlyTotalData = @json($websiteVisitorMonth);
var registerUser = {
series: [{
name: 'Total Pengunjung',
data: monthlyTotalData
}],
chart: {
height: 350,
type: 'bar',
},
plotOptions: {
bar: {
borderRadius: 3,
dataLabels: {
position: 'center', // top, center, bottom
},
}
},
dataLabels: {
enabled: true,
formatter: function (val) {
return val + " Pengunjung";
},
offsetY: -20,
style: {
fontSize: '12px',
colors: ["#304758"]
}
},
xaxis: {
categories: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
position: 'top',
axisBorder: {
show: false
},
axisTicks: {
show: false
},
crosshairs: {
fill: {
type: 'gradient',
gradient: {
colorFrom: '#3572EF',
colorTo: '#3ABEF9',
stops: [0, 100],
opacityFrom: 0.4,
opacityTo: 0.5,
}
}
},
tooltip: {
enabled: true,
}
},
yaxis: {
axisBorder: {
show: false
},
axisTicks: {
show: false,
},
labels: {
show: false,
formatter: function (val) {
return val + " Akun";
}
}
},
title: {
text: 'Pengunjung Website Simedkom',
floating: true,
offsetY: 330,
align: 'center',
style: {
color: '#444'
}
}
};
var publicationChart = new ApexCharts(document.querySelector("#websiteVisitorMonth"), registerUser);
publicationChart.render();
</script>