From 30ca819aa178d9356b24a331b0e94372b6efbba2 Mon Sep 17 00:00:00 2001
From: arifal <arifalhidayat10@gmail.com>
Date: Thu, 27 Feb 2025 20:14:37 +0700
Subject: [PATCH] fix color on maps

---
 resources/js/maps/maps-kml.js | 42 +++++++++++++++++++++++++++--------
 1 file changed, 33 insertions(+), 9 deletions(-)

diff --git a/resources/js/maps/maps-kml.js b/resources/js/maps/maps-kml.js
index 46a9ac5..a6e9776 100644
--- a/resources/js/maps/maps-kml.js
+++ b/resources/js/maps/maps-kml.js
@@ -16,21 +16,45 @@ document.addEventListener("DOMContentLoaded", function () {
         .then((res) => res.json())
         .then((geojson) => {
             let colorMapping = {
-                "Kawasan Pariwisata": "#ff6600", // Orange
-                "Kawasan Industri": "#0000ff", // Biru
-                "Kawasan Pemukiman": "#ff0000", // Merah
-                "Kawasan Hutan": "#008000", // Hijau
-                "Kawasan Pertanian": "#ffff00", // Kuning
+                BJ: "rgb(235, 30, 30)",
+                BA: "rgb(151, 219, 242)",
+                CA: "rgb(70, 70, 165)",
+                "P-2": "rgb(230, 255, 75)",
+                HL: "rgb(50, 95, 40)",
+                HPT: "rgb(75, 155, 55)",
+                HP: "rgb(125, 180, 55)",
+                W: "rgb(255, 165, 255)",
+                PTL: "rgb(0, 255, 205)",
+                "IK-2": "rgb(130, 185, 210)",
+                "P-3": "rgb(175, 175, 55)",
+                PS: "rgb(5, 215, 215)",
+                PD: "rgb(235, 155, 60)",
+                PK: "rgb(245, 155, 30)",
+                HK: "rgb(155, 0, 255)",
+                KPI: "rgb(105, 0, 0)",
+                MBT: "rgb(95, 115, 145)",
+                "P-4": "rgb(185, 235, 185)",
+                TB: "rgb(70, 150, 255)",
+                "P-1": "rgb(200, 245, 70)",
+                TR: "rgb(215, 55, 0)",
+                THR: "rgb(185, 165, 255)",
+                TWA: "rgb(210, 190, 255)",
             };
             var geoLayer = L.geoJSON(geojson, {
                 style: function (feature) {
-                    let name = feature.properties.Name; // Ambil properti Name
+                    let htmlString = feature.properties.description.toString();
 
-                    console.log("Zone Type:", name);
+                    let match = htmlString.match(
+                        /<td>Kode Kawasan<\/td>\s*<td>(.*?)<\/td>/
+                    );
+
+                    console.log("Kode Kawasan ", match[1]);
+
+                    let color_code = match[1];
 
                     return {
-                        color: "#333333", // Warna garis
-                        fillColor: colorMapping[name] || "#cccccc", // Gunakan warna dari mapping
+                        color: colorMapping[color_code], 
+                        fillColor: colorMapping[color_code] || "#cccccc", 
                         fillOpacity: 0.6,
                         weight: 1.5,
                     };