FourLabs-UN2's picture
Faça variando em tons dessas cores:
caa3c72 verified
document.addEventListener('DOMContentLoaded', function() {
// Sample data - replace with actual API calls if needed
const months = ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez'];
const tokenData = {
labels: months,
datasets: [{
label: 'Tokens Gerados',
data: [1245, 1890, 1823, 2345, 2789, 3021, 3420, 3210, 2956, 2567, 2108, 1765],
backgroundColor: 'rgba(255, 88, 15, 0.8)',
borderColor: 'rgba(255, 61, 0, 1)',
borderWidth: 1,
borderRadius: {
topLeft: 6,
topRight: 6
},
borderSkipped: false
}]
};
// Chart configuration
const config = {
type: 'bar',
data: tokenData,
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
legend: {
display: false
},
tooltip: {
callbacks: {
label: function(context) {
return context.parsed.y.toLocaleString() + ' tokens';
}
}
}
},
scales: {
y: {
beginAtZero: true,
grid: {
drawBorder: false,
color: 'rgba(0, 0, 0, 0.05)'
},
ticks: {
callback: function(value) {
return value.toLocaleString();
}
}
},
x: {
grid: {
display: false
}
}
},
animation: {
duration: 1000,
easing: 'easeOutQuart'
}
}
};
// Initialize chart
const ctx = document.getElementById('tokenChart').getContext('2d');
new Chart(ctx, config);
});