dashboard produksi & ganti warna chart
This commit is contained in:
@@ -144,10 +144,10 @@
|
||||
<div class="absolute bottom-3 left-3 bg-white/95 p-3 rounded-lg text-xs border border-gray-200 shadow-sm backdrop-blur-sm">
|
||||
<div class="font-bold text-gray-700 mb-2">Legenda Tanaman:</div>
|
||||
<div class="grid grid-cols-2 gap-x-4 gap-y-2">
|
||||
<div class="flex items-center gap-2"><div class="w-3 h-3 bg-[#6F4E37] rounded-full shadow-sm"></div> Kopi</div>
|
||||
<div class="flex items-center gap-2"><div class="w-3 h-3 bg-[#eab308] rounded-full shadow-sm"></div> Vanili</div>
|
||||
<div class="flex items-center gap-2"><div class="w-3 h-3 bg-[#D2691E] rounded-full shadow-sm"></div> Kakao</div>
|
||||
<div class="flex items-center gap-2"><div class="w-3 h-3 bg-[#9ca3af] rounded-full shadow-sm"></div> Kemiri</div>
|
||||
<div class="flex items-center gap-2"><div class="w-3 h-3 bg-[#6FD68F] rounded-full shadow-sm"></div> Kopi</div>
|
||||
<div class="flex items-center gap-2"><div class="w-3 h-3 bg-[#FFB46F] rounded-full shadow-sm"></div> Vanili</div>
|
||||
<div class="flex items-center gap-2"><div class="w-3 h-3 bg-[#9D8EF0] rounded-full shadow-sm"></div> Kakao</div>
|
||||
<div class="flex items-center gap-2"><div class="w-3 h-3 bg-[#9EA6B0] rounded-full shadow-sm"></div> Kemiri</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -253,6 +253,9 @@
|
||||
@push('scripts')
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const pastelChart = config.chartColors || {};
|
||||
const pastelCategory = pastelChart.categories || {};
|
||||
const gridColor = pastelChart.grid || '#E8EDF5';
|
||||
|
||||
// 1. Inisialisasi Icons
|
||||
if(typeof lucide !== 'undefined') {
|
||||
@@ -263,19 +266,19 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
const spatialData = [
|
||||
{
|
||||
id: 'L-001', owner: 'Yosef Neta', familySize: 5, area: '1.2 Ha', village: 'Radabata',
|
||||
polygon: "15,25 75,15 90,85 20,70", fill: "rgba(34, 197, 94, 0.15)", stroke: "#16a34a",
|
||||
polygon: "15,25 75,15 90,85 20,70", fill: "rgba(111, 214, 143, 0.24)", stroke: "#6FD68F",
|
||||
plants: [
|
||||
{ id: 'P-01', type: 'Kopi', cx: 35, cy: 35, planted: 'Mei 2021', status: 'Produktif', intervensi: 'Pemupukan Organik (Okt 2023)', panen: '45 kg/musim', color: '#6F4E37' },
|
||||
{ id: 'P-02', type: 'Vanili', cx: 65, cy: 45, planted: 'Jan 2022', status: 'Berbunga', intervensi: 'Pelatihan Polinasi (Feb 2024)', panen: 'Belum panen', color: '#eab308' },
|
||||
{ id: 'P-03', type: 'Kopi', cx: 50, cy: 65, planted: 'Mei 2021', status: 'Produktif', intervensi: 'Pemangkasan (Nov 2023)', panen: '40 kg/musim', color: '#6F4E37' },
|
||||
{ id: 'P-01', type: 'Kopi', cx: 35, cy: 35, planted: 'Mei 2021', status: 'Produktif', intervensi: 'Pemupukan Organik (Okt 2023)', panen: '45 kg/musim', color: pastelCategory.coffee || '#6FD68F' },
|
||||
{ id: 'P-02', type: 'Vanili', cx: 65, cy: 45, planted: 'Jan 2022', status: 'Berbunga', intervensi: 'Pelatihan Polinasi (Feb 2024)', panen: 'Belum panen', color: pastelCategory.vanilla || '#FFB46F' },
|
||||
{ id: 'P-03', type: 'Kopi', cx: 50, cy: 65, planted: 'Mei 2021', status: 'Produktif', intervensi: 'Pemangkasan (Nov 2023)', panen: '40 kg/musim', color: pastelCategory.coffee || '#6FD68F' },
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 'L-002', owner: 'Maria Goreti', familySize: 3, area: '0.8 Ha', village: 'Ubedolumolo',
|
||||
polygon: "110,40 170,15 190,65 125,85", fill: "rgba(59, 130, 246, 0.15)", stroke: "#2563eb",
|
||||
polygon: "110,40 170,15 190,65 125,85", fill: "rgba(95, 199, 214, 0.20)", stroke: "#5FC7D6",
|
||||
plants: [
|
||||
{ id: 'P-04', type: 'Kemiri', cx: 140, cy: 45, planted: 'Agu 2018', status: 'Produktif', intervensi: 'Pembersihan Gulma', panen: '120 kg/musim', color: '#9ca3af' },
|
||||
{ id: 'P-05', type: 'Kakao', cx: 165, cy: 55, planted: 'Okt 2020', status: 'Terserang Hama', intervensi: 'Penyemprotan Bio-pestisida (Jan 2024)', panen: '20 kg/musim', color: '#D2691E' },
|
||||
{ id: 'P-04', type: 'Kemiri', cx: 140, cy: 45, planted: 'Agu 2018', status: 'Produktif', intervensi: 'Pembersihan Gulma', panen: '120 kg/musim', color: pastelCategory.candlenut || '#9EA6B0' },
|
||||
{ id: 'P-05', type: 'Kakao', cx: 165, cy: 55, planted: 'Okt 2020', status: 'Terserang Hama', intervensi: 'Penyemprotan Bio-pestisida (Jan 2024)', panen: '20 kg/musim', color: pastelCategory.cacao || '#9D8EF0' },
|
||||
]
|
||||
}
|
||||
];
|
||||
@@ -440,24 +443,24 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
{
|
||||
label: 'Kopi',
|
||||
data: [0.5, 0.7, 1.1, 1.5],
|
||||
borderColor: '#6F4E37',
|
||||
backgroundColor: '#6F4E37',
|
||||
borderColor: pastelCategory.coffee || '#6FD68F',
|
||||
backgroundColor: pastelCategory.coffee || '#6FD68F',
|
||||
tension: 0.3,
|
||||
borderWidth: 2
|
||||
},
|
||||
{
|
||||
label: 'Vanili',
|
||||
data: [0.1, 0.15, 0.3, 0.5],
|
||||
borderColor: '#eab308',
|
||||
backgroundColor: '#eab308',
|
||||
borderColor: pastelCategory.vanilla || '#FFB46F',
|
||||
backgroundColor: pastelCategory.vanilla || '#FFB46F',
|
||||
tension: 0.3,
|
||||
borderWidth: 2
|
||||
},
|
||||
{
|
||||
label: 'Kakao',
|
||||
data: [0.4, 0.5, 0.8, 1.2],
|
||||
borderColor: '#D2691E',
|
||||
backgroundColor: '#D2691E',
|
||||
borderColor: pastelCategory.cacao || '#9D8EF0',
|
||||
backgroundColor: pastelCategory.cacao || '#9D8EF0',
|
||||
tension: 0.3,
|
||||
borderWidth: 2
|
||||
}
|
||||
@@ -467,7 +470,7 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
responsive: true, maintainAspectRatio: false,
|
||||
interaction: { mode: 'index', intersect: false },
|
||||
scales: {
|
||||
y: { title: { display: true, text: 'Ton per Hektar (Ton/Ha)' }, grid: { color: '#f3f4f6' } },
|
||||
y: { title: { display: true, text: 'Ton per Hektar (Ton/Ha)' }, grid: { color: gridColor } },
|
||||
x: { grid: { display: false } }
|
||||
},
|
||||
plugins: {
|
||||
@@ -489,11 +492,11 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
label: 'Jumlah Bibit Didistribusikan',
|
||||
data: [15000, 5200, 8000, 7000, 10000],
|
||||
backgroundColor: [
|
||||
'rgba(111, 78, 55, 0.8)', // Kopi
|
||||
'rgba(234, 179, 8, 0.8)', // Vanili
|
||||
'rgba(210, 105, 30, 0.8)', // Kakao
|
||||
'rgba(156, 163, 175, 0.8)', // Kemiri
|
||||
'rgba(34, 197, 94, 0.8)' // Pelindung (Hijau)
|
||||
'rgba(111, 214, 143, 0.86)', // Kopi
|
||||
'rgba(255, 180, 111, 0.86)', // Vanili
|
||||
'rgba(157, 142, 240, 0.86)', // Kakao
|
||||
'rgba(179, 181, 188, 0.86)', // Kemiri
|
||||
'rgba(101, 216, 189, 0.86)' // Pelindung
|
||||
],
|
||||
borderRadius: 4
|
||||
}
|
||||
@@ -502,7 +505,7 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
options: {
|
||||
responsive: true, maintainAspectRatio: false,
|
||||
scales: {
|
||||
y: { beginAtZero: true, grid: { color: '#f3f4f6' } },
|
||||
y: { beginAtZero: true, grid: { color: gridColor } },
|
||||
x: { grid: { display: false } }
|
||||
},
|
||||
plugins: {
|
||||
@@ -515,4 +518,4 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
|
||||
});
|
||||
</script>
|
||||
@endpush
|
||||
@endpush
|
||||
|
||||
Reference in New Issue
Block a user