muqriz
/
SIBS2024
關注 1
收藏 0
複製 0
程式碼 問題 0 合併請求 0 版本發佈 0 Wiki 活動
瀏覽代碼

done bentong

master
azri 3 月之前
父節點
9cf7af7df3
當前提交
b5f372bf95
共有 11 個檔案被更改，包括 160 行新增 和 2049 行删除
分割檢視 顯示文件統計
  1. 27
    0
      css/app.css
  2. 0
    268
      details/bera.html
  3. 0
    268
      details/kuantan.html
  4. 0
    268
      details/lipis.html
  5. 6
    145
      details/penternakan_hsd_19372.html
  6. 16
    143
      lists/bentong.html
  7. 0
    234
      lists/bera.html
  8. 0
    234
      lists/kuantan.html
  9. 0
    234
      lists/lipis.html
  10. 111
    0
      pdf_pages/hsd_19372.html
  11. 0
    255
      pdf_pages/view_pdf.html

+ 27
- 0
css/app.css 查看文件 

@@ -75,4 +75,31 @@
75 75
76 76 
 .hidden {
77 77 
     display: none;
78 
+}
79 
+
80 
+html,
81 
+body {
82 
+    height: 370px;
83 
+    padding: 0;
84 
+    margin: 0;
85 
+}
86 
+#map {
87 
+    height: 360px;
88 
+    width: 300px;
89 
+    overflow: hidden;
90 
+    float: left;
91 
+    border: thin solid #333;
92 
+}
93 
+#capture {
94 
+    height: 360px;
95 
+    width: 480px;
96 
+    overflow: hidden;
97 
+    float: left;
98 
+    background-color: #ECECFB;
99 
+    border: thin solid #333;
100 
+    border-left: none;
101 
+}
102 
+#pdfViewer {
103 
+    width: 100%;
104 
+    height: 600px;
78 105 
 }

+ 0
- 268
details/bera.html 查看文件 

@@ -1,268 +0,0 @@
1 
-<!DOCTYPE html>
2 
-<html>
3 
-
4 
-<head>
5 
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
6 
-    <meta charset="utf-8">
7 
-    <title>KML Click Capture Sample</title>
8 
-    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
9 
-    <script src="node_modules/bootstrap/dist/js/bootstrap.min.js" defer></script>
10 
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
11 
-        integrity="sha512-abc123..." crossorigin="anonymous" />
12 
-
13 
-
14 
-
15 
-    <style>
16 
-        html,
17 
-        body {
18 
-            height: 370px;
19 
-            padding: 0;
20 
-            margin: 0;
21 
-        }
22 
-
23 
-        #map {
24 
-            height: 360px;
25 
-            width: 300px;
26 
-            overflow: hidden;
27 
-            float: left;
28 
-            border: thin solid #333;
29 
-        }
30 
-
31 
-        #capture {
32 
-            height: 360px;
33 
-            width: 480px;
34 
-            overflow: hidden;
35 
-            float: left;
36 
-            background-color: #ECECFB;
37 
-            border: thin solid #333;
38 
-            border-left: none;
39 
-        }
40 
-
41 
-        #pdfViewer {
42 
-            width: 100%;
43 
-            height: 600px;
44 
-        }
45 
-    </style>
46 
-
47 
-    <style>
48 
-        /* CSS */
49 
-        .button-23 {
50 
-            background-color: #FFFFFF;
51 
-            border: 1px solid #222222;
52 
-            border-radius: 8px;
53 
-            box-sizing: border-box;
54 
-            color: #222222;
55 
-            cursor: pointer;
56 
-            display: inline-block;
57 
-            font-family: Circular, -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
58 
-            font-size: 16px;
59 
-            font-weight: 600;
60 
-            line-height: 20px;
61 
-            margin: 0;
62 
-            outline: none;
63 
-            padding: 13px 23px;
64 
-            position: relative;
65 
-            text-align: center;
66 
-            text-decoration: none;
67 
-            touch-action: manipulation;
68 
-            transition: box-shadow .2s, -ms-transform .1s, -webkit-transform .1s, transform .1s;
69 
-            user-select: none;
70 
-            -webkit-user-select: none;
71 
-            width: auto;
72 
-        }
73 
-
74 
-        .button-23:focus-visible {
75 
-            box-shadow: #222222 0 0 0 2px, rgba(255, 255, 255, 0.8) 0 0 0 4px;
76 
-            transition: box-shadow .2s;
77 
-        }
78 
-
79 
-        .button-23:active {
80 
-            background-color: #F7F7F7;
81 
-            border-color: #000000;
82 
-            transform: scale(.96);
83 
-        }
84 
-
85 
-        .button-23:disabled {
86 
-            border-color: #DDDDDD;
87 
-            color: #DDDDDD;
88 
-            cursor: not-allowed;
89 
-            opacity: 1;
90 
-        }
91 
-
92 
-        .map-svg {
93 
-            display: block;
94 
-            margin: 0 auto;
95 
-            filter: drop-shadow(-16px 11px 2px rgba(0, 0, 0, 0.5));
96 
-
97 
-            a {
98 
-                transition: all 1s;
99 
-                transform-origin: 50% 50%;
100 
-                text-decoration: none;
101 
-                filter: drop-shadow(3px 10px 5px rgb(0 0 0 / 0.4));
102 
-
103 
-                @media only screen and (min-width: 992px) {
104 
-
105 
-                    polygon,
106 
-                    &:hover {
107 
-                        cursor: pointer;
108 
-                        transform: scale(1.05);
109 
-                        filter: drop-shadow(0px 15px 12px rgb(0 0 0 / 0.7));
110 
-
111 
-                        .st0 {
112 
-                            fill: $dark-default;
113 
-                        }
114 
-                    }
115 
-                }
116 
-            }
117 
-
118 
-            .pahang-barat {
119 
-                fill: #427bba;
120 
-            }
121 
-
122 
-            .pahang-tengah {
123 
-                fill: #144172;
124 
-            }
125 
-
126 
-            .pahang-timur {
127 
-                fill: #0c6088;
128 
-            }
129 
-
130 
-            .label-text {
131 
-                font-size: 35px;
132 
-                fill: white;
133 
-                transform: translate(0,
134 
-                        3px);
135 
-                /* adjust vertical position to centre text */
136 
-            }
137 
-
138 
-            .label-text-cameron {
139 
-                font-size: 20px;
140 
-                fill: white;
141 
-                transform: translate(0,
142 
-                        3px);
143 
-                /* adjust vertical position to centre text */
144 
-            }
145 
-
146 
-
147 
-        }
148 
-    </style>
149 
-
150 
-</head>
151 
-
152 
-<body>
153 
-
154 
-    <section class="section" style="max-height: 100vh;">
155 
-
156 
-        <div class=""
157 
-            style="background-color: #1F3F6D; min-height: 50px; display: flex; align-items: center;padding-left: 100px;">
158 
-            <h6 style="color: white;margin-right: 1em;" class=""><a style="color: white;" href="../index.html"><i
159 
-                        class="fas fa-chevron-left"></i></a></h6>
160 
-            <h6 style="color: white;">Bera</h6>
161 
-        </div>
162 
-
163 
-        <div class="text-center pt-5"
164 
-            style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
165 
-            <h5 style="font-weight: 500;">Perbadanan Setiausaha Kejaraan Pahang</h5>
166 
-
167 
-        </div>
168 
-
169 
-        <div class="text-center pt-1 pb-5"
170 
-            style="background-color: white;display: flex; justify-content: center; align-items: center;margin-left: -150px;">
171 
-            <div class="pt-5 pb-5" style="width: 600px;height: 100px;">
172 
-                <!-- <img style="border-radius: 20px;" src="image.png" alt=""> -->
173 
-
174 
-                <div id="map" style="width: 800px;"></div>
175 
-                <!-- <div id="capture"></div> -->
176 
-
177 
-
178 
-
179 
-            </div>
180 
-        </div>
181 
-
182 
-
183 
-
184 
-
185 
-        <div class="text-center pt-5"
186 
-            style="background-color: white; display: flex; justify-content: center; align-items: left; padding-left: 100px; margin-top: 250px;">
187 
-            <div style="display: flex; flex-direction: row;">
188 
-                <div>
189 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Lokasi :</span> <span
190 
-                            style="color: #ACACAC;">Gambangs</span></h6>
191 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Mukim :</span> <span
192 
-                            style="color: #ACACAC;">Ulu Lepar</span></h6>
193 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Daerah :</span> <span
194 
-                            style="color: #ACACAC;">Kuantan</span></h6>
195 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Negeri :</span> <span
196 
-                            style="color: #ACACAC;">Pahang Darul Makmur</span></h6>
197 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Skala :</span> <span
198 
-                            style="color: #ACACAC;">Tanpa Skala</span></h6>
199 
-                </div>
200 
-                <div style="margin-left: 100px;">
201 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">No. Hak Milik :</span>
202 
-                        <span style="color: #ACACAC;">HSD 62438</span>
203 
-                    </h6>
204 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Keluasan (MP) :</span>
205 
-                        <span style="color: #ACACAC;">607280</span>
206 
-                    </h6>
207 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Kehunaan :</span> <span
208 
-                            style="color: #ACACAC;">Bangunan</span></h6>
209 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Start Neat :</span>
210 
-                        <span style="color: #ACACAC;">Pembangunan Bercampur</span>
211 
-                    </h6>
212 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;"></span> <span
213 
-                            style="color: #ACACAC;"></span></h6>
214 
-                </div>
215 
-            </div>
216 
-        </div>
217 
-
218 
-        <div class="text-center pt-5 pb-5"
219 
-            style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
220 
-            <a href="view_pdf.html" class="button-23 mb-2 mr-2"
221 
-                style="background-color: #1F9027; color: white; border: none;width: 200px;" role="button"
222 
-                data-toggle="modal" data-target="#exampleModal">View
223 
-                PDF</a>
224 
-
225 
-        </div>
226 
-
227 
-        <script src="js/jquery-3.7.1.js" defer></script>
228 
-
229 
-        <script src="js/pdfjs-viewer.js" defer></script>
230 
-        <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.6.347/pdf.min.js"
231 
-            integrity="sha512-Z8CqofpIcnJN80feS2uccz+pXWgZzeKxDsDNMD/dJ6997/LSRY+W4NmEt9acwR+Gt9OHN0kkI1CTianCwoqcjQ=="
232 
-            crossorigin="anonymous" referrerpolicy="no-referrer" defer></script>
233 
-
234 
-    </section>
235 
-
236 
-
237 
-    <!-- <div id="map"></div> -->
238 
-
239 
-    <script>
240 
-        var map;
241 
-        var src = 'https://file.io/t3IwR1hlxwkZ';
242 
-
243 
-        function initMap() {
244 
-            map = new google.maps.Map(document.getElementById('map'), {
245 
-                center: new google.maps.LatLng(-19.257753, 146.823688),
246 
-                zoom: 2,
247 
-                mapTypeId: 'satellite'
248 
-            });
249 
-
250 
-            var kmlLayer = new google.maps.KmlLayer(src, {
251 
-                suppressInfoWindows: true,
252 
-                preserveViewport: false,
253 
-                map: map
254 
-            });
255 
-        }
256 
-
257 
-
258 
-
259 
-
260 
-
261 
-    </script>
262 
-    <script async
263 
-        src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCj5eAmQOg6IhdABVPCBT6ubZ3Yj_IWejI&callback=initMap">
264 
-        </script>
265 
-
266 
-</body>
267 
-
268 
-</html>

+ 0
- 268
details/kuantan.html 查看文件 

@@ -1,268 +0,0 @@
1 
-<!DOCTYPE html>
2 
-<html>
3 
-
4 
-<head>
5 
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
6 
-    <meta charset="utf-8">
7 
-    <title>KML Click Capture Sample</title>
8 
-    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
9 
-    <script src="node_modules/bootstrap/dist/js/bootstrap.min.js" defer></script>
10 
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
11 
-        integrity="sha512-abc123..." crossorigin="anonymous" />
12 
-
13 
-
14 
-
15 
-    <style>
16 
-        html,
17 
-        body {
18 
-            height: 370px;
19 
-            padding: 0;
20 
-            margin: 0;
21 
-        }
22 
-
23 
-        #map {
24 
-            height: 360px;
25 
-            width: 300px;
26 
-            overflow: hidden;
27 
-            float: left;
28 
-            border: thin solid #333;
29 
-        }
30 
-
31 
-        #capture {
32 
-            height: 360px;
33 
-            width: 480px;
34 
-            overflow: hidden;
35 
-            float: left;
36 
-            background-color: #ECECFB;
37 
-            border: thin solid #333;
38 
-            border-left: none;
39 
-        }
40 
-
41 
-        #pdfViewer {
42 
-            width: 100%;
43 
-            height: 600px;
44 
-        }
45 
-    </style>
46 
-
47 
-    <style>
48 
-        /* CSS */
49 
-        .button-23 {
50 
-            background-color: #FFFFFF;
51 
-            border: 1px solid #222222;
52 
-            border-radius: 8px;
53 
-            box-sizing: border-box;
54 
-            color: #222222;
55 
-            cursor: pointer;
56 
-            display: inline-block;
57 
-            font-family: Circular, -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
58 
-            font-size: 16px;
59 
-            font-weight: 600;
60 
-            line-height: 20px;
61 
-            margin: 0;
62 
-            outline: none;
63 
-            padding: 13px 23px;
64 
-            position: relative;
65 
-            text-align: center;
66 
-            text-decoration: none;
67 
-            touch-action: manipulation;
68 
-            transition: box-shadow .2s, -ms-transform .1s, -webkit-transform .1s, transform .1s;
69 
-            user-select: none;
70 
-            -webkit-user-select: none;
71 
-            width: auto;
72 
-        }
73 
-
74 
-        .button-23:focus-visible {
75 
-            box-shadow: #222222 0 0 0 2px, rgba(255, 255, 255, 0.8) 0 0 0 4px;
76 
-            transition: box-shadow .2s;
77 
-        }
78 
-
79 
-        .button-23:active {
80 
-            background-color: #F7F7F7;
81 
-            border-color: #000000;
82 
-            transform: scale(.96);
83 
-        }
84 
-
85 
-        .button-23:disabled {
86 
-            border-color: #DDDDDD;
87 
-            color: #DDDDDD;
88 
-            cursor: not-allowed;
89 
-            opacity: 1;
90 
-        }
91 
-
92 
-        .map-svg {
93 
-            display: block;
94 
-            margin: 0 auto;
95 
-            filter: drop-shadow(-16px 11px 2px rgba(0, 0, 0, 0.5));
96 
-
97 
-            a {
98 
-                transition: all 1s;
99 
-                transform-origin: 50% 50%;
100 
-                text-decoration: none;
101 
-                filter: drop-shadow(3px 10px 5px rgb(0 0 0 / 0.4));
102 
-
103 
-                @media only screen and (min-width: 992px) {
104 
-
105 
-                    polygon,
106 
-                    &:hover {
107 
-                        cursor: pointer;
108 
-                        transform: scale(1.05);
109 
-                        filter: drop-shadow(0px 15px 12px rgb(0 0 0 / 0.7));
110 
-
111 
-                        .st0 {
112 
-                            fill: $dark-default;
113 
-                        }
114 
-                    }
115 
-                }
116 
-            }
117 
-
118 
-            .pahang-barat {
119 
-                fill: #427bba;
120 
-            }
121 
-
122 
-            .pahang-tengah {
123 
-                fill: #144172;
124 
-            }
125 
-
126 
-            .pahang-timur {
127 
-                fill: #0c6088;
128 
-            }
129 
-
130 
-            .label-text {
131 
-                font-size: 35px;
132 
-                fill: white;
133 
-                transform: translate(0,
134 
-                        3px);
135 
-                /* adjust vertical position to centre text */
136 
-            }
137 
-
138 
-            .label-text-cameron {
139 
-                font-size: 20px;
140 
-                fill: white;
141 
-                transform: translate(0,
142 
-                        3px);
143 
-                /* adjust vertical position to centre text */
144 
-            }
145 
-
146 
-
147 
-        }
148 
-    </style>
149 
-
150 
-</head>
151 
-
152 
-<body>
153 
-
154 
-    <section class="section" style="max-height: 100vh;">
155 
-
156 
-        <div class=""
157 
-            style="background-color: #1F3F6D; min-height: 50px; display: flex; align-items: center;padding-left: 100px;">
158 
-            <h6 style="color: white;margin-right: 1em;" class=""><a style="color: white;" href="../index.html"><i
159 
-                        class="fas fa-chevron-left"></i></a></h6>
160 
-            <h6 style="color: white;">Kuantan</h6>
161 
-        </div>
162 
-
163 
-        <div class="text-center pt-5"
164 
-            style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
165 
-            <h5 style="font-weight: 500;">Perbadanan Setiausaha Kejaraan Pahang</h5>
166 
-
167 
-        </div>
168 
-
169 
-        <div class="text-center pt-1 pb-5"
170 
-            style="background-color: white;display: flex; justify-content: center; align-items: center;margin-left: -150px;">
171 
-            <div class="pt-5 pb-5" style="width: 600px;height: 100px;">
172 
-                <!-- <img style="border-radius: 20px;" src="image.png" alt=""> -->
173 
-
174 
-                <div id="map" style="width: 800px;"></div>
175 
-                <!-- <div id="capture"></div> -->
176 
-
177 
-
178 
-
179 
-            </div>
180 
-        </div>
181 
-
182 
-
183 
-
184 
-
185 
-        <div class="text-center pt-5"
186 
-            style="background-color: white; display: flex; justify-content: center; align-items: left; padding-left: 100px; margin-top: 250px;">
187 
-            <div style="display: flex; flex-direction: row;">
188 
-                <div>
189 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Lokasi :</span> <span
190 
-                            style="color: #ACACAC;">Gambangs</span></h6>
191 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Mukim :</span> <span
192 
-                            style="color: #ACACAC;">Ulu Lepar</span></h6>
193 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Daerah :</span> <span
194 
-                            style="color: #ACACAC;">Kuantan</span></h6>
195 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Negeri :</span> <span
196 
-                            style="color: #ACACAC;">Pahang Darul Makmur</span></h6>
197 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Skala :</span> <span
198 
-                            style="color: #ACACAC;">Tanpa Skala</span></h6>
199 
-                </div>
200 
-                <div style="margin-left: 100px;">
201 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">No. Hak Milik :</span>
202 
-                        <span style="color: #ACACAC;">HSD 62438</span>
203 
-                    </h6>
204 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Keluasan (MP) :</span>
205 
-                        <span style="color: #ACACAC;">607280</span>
206 
-                    </h6>
207 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Kehunaan :</span> <span
208 
-                            style="color: #ACACAC;">Bangunan</span></h6>
209 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Start Neat :</span>
210 
-                        <span style="color: #ACACAC;">Pembangunan Bercampur</span>
211 
-                    </h6>
212 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;"></span> <span
213 
-                            style="color: #ACACAC;"></span></h6>
214 
-                </div>
215 
-            </div>
216 
-        </div>
217 
-
218 
-        <div class="text-center pt-5 pb-5"
219 
-            style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
220 
-            <a href="view_pdf.html" class="button-23 mb-2 mr-2"
221 
-                style="background-color: #1F9027; color: white; border: none;width: 200px;" role="button"
222 
-                data-toggle="modal" data-target="#exampleModal">View
223 
-                PDF</a>
224 
-
225 
-        </div>
226 
-
227 
-        <script src="js/jquery-3.7.1.js" defer></script>
228 
-
229 
-        <script src="js/pdfjs-viewer.js" defer></script>
230 
-        <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.6.347/pdf.min.js"
231 
-            integrity="sha512-Z8CqofpIcnJN80feS2uccz+pXWgZzeKxDsDNMD/dJ6997/LSRY+W4NmEt9acwR+Gt9OHN0kkI1CTianCwoqcjQ=="
232 
-            crossorigin="anonymous" referrerpolicy="no-referrer" defer></script>
233 
-
234 
-    </section>
235 
-
236 
-
237 
-    <!-- <div id="map"></div> -->
238 
-
239 
-    <script>
240 
-        var map;
241 
-        var src = 'https://file.io/t3IwR1hlxwkZ';
242 
-
243 
-        function initMap() {
244 
-            map = new google.maps.Map(document.getElementById('map'), {
245 
-                center: new google.maps.LatLng(-19.257753, 146.823688),
246 
-                zoom: 2,
247 
-                mapTypeId: 'satellite'
248 
-            });
249 
-
250 
-            var kmlLayer = new google.maps.KmlLayer(src, {
251 
-                suppressInfoWindows: true,
252 
-                preserveViewport: false,
253 
-                map: map
254 
-            });
255 
-        }
256 
-
257 
-
258 
-
259 
-
260 
-
261 
-    </script>
262 
-    <script async
263 
-        src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCj5eAmQOg6IhdABVPCBT6ubZ3Yj_IWejI&callback=initMap">
264 
-        </script>
265 
-
266 
-</body>
267 
-
268 
-</html>

+ 0
- 268
details/lipis.html 查看文件 

@@ -1,268 +0,0 @@
1 
-<!DOCTYPE html>
2 
-<html>
3 
-
4 
-<head>
5 
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
6 
-    <meta charset="utf-8">
7 
-    <title>KML Click Capture Sample</title>
8 
-    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
9 
-    <script src="node_modules/bootstrap/dist/js/bootstrap.min.js" defer></script>
10 
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
11 
-        integrity="sha512-abc123..." crossorigin="anonymous" />
12 
-
13 
-
14 
-
15 
-    <style>
16 
-        html,
17 
-        body {
18 
-            height: 370px;
19 
-            padding: 0;
20 
-            margin: 0;
21 
-        }
22 
-
23 
-        #map {
24 
-            height: 360px;
25 
-            width: 300px;
26 
-            overflow: hidden;
27 
-            float: left;
28 
-            border: thin solid #333;
29 
-        }
30 
-
31 
-        #capture {
32 
-            height: 360px;
33 
-            width: 480px;
34 
-            overflow: hidden;
35 
-            float: left;
36 
-            background-color: #ECECFB;
37 
-            border: thin solid #333;
38 
-            border-left: none;
39 
-        }
40 
-
41 
-        #pdfViewer {
42 
-            width: 100%;
43 
-            height: 600px;
44 
-        }
45 
-    </style>
46 
-
47 
-    <style>
48 
-        /* CSS */
49 
-        .button-23 {
50 
-            background-color: #FFFFFF;
51 
-            border: 1px solid #222222;
52 
-            border-radius: 8px;
53 
-            box-sizing: border-box;
54 
-            color: #222222;
55 
-            cursor: pointer;
56 
-            display: inline-block;
57 
-            font-family: Circular, -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
58 
-            font-size: 16px;
59 
-            font-weight: 600;
60 
-            line-height: 20px;
61 
-            margin: 0;
62 
-            outline: none;
63 
-            padding: 13px 23px;
64 
-            position: relative;
65 
-            text-align: center;
66 
-            text-decoration: none;
67 
-            touch-action: manipulation;
68 
-            transition: box-shadow .2s, -ms-transform .1s, -webkit-transform .1s, transform .1s;
69 
-            user-select: none;
70 
-            -webkit-user-select: none;
71 
-            width: auto;
72 
-        }
73 
-
74 
-        .button-23:focus-visible {
75 
-            box-shadow: #222222 0 0 0 2px, rgba(255, 255, 255, 0.8) 0 0 0 4px;
76 
-            transition: box-shadow .2s;
77 
-        }
78 
-
79 
-        .button-23:active {
80 
-            background-color: #F7F7F7;
81 
-            border-color: #000000;
82 
-            transform: scale(.96);
83 
-        }
84 
-
85 
-        .button-23:disabled {
86 
-            border-color: #DDDDDD;
87 
-            color: #DDDDDD;
88 
-            cursor: not-allowed;
89 
-            opacity: 1;
90 
-        }
91 
-
92 
-        .map-svg {
93 
-            display: block;
94 
-            margin: 0 auto;
95 
-            filter: drop-shadow(-16px 11px 2px rgba(0, 0, 0, 0.5));
96 
-
97 
-            a {
98 
-                transition: all 1s;
99 
-                transform-origin: 50% 50%;
100 
-                text-decoration: none;
101 
-                filter: drop-shadow(3px 10px 5px rgb(0 0 0 / 0.4));
102 
-
103 
-                @media only screen and (min-width: 992px) {
104 
-
105 
-                    polygon,
106 
-                    &:hover {
107 
-                        cursor: pointer;
108 
-                        transform: scale(1.05);
109 
-                        filter: drop-shadow(0px 15px 12px rgb(0 0 0 / 0.7));
110 
-
111 
-                        .st0 {
112 
-                            fill: $dark-default;
113 
-                        }
114 
-                    }
115 
-                }
116 
-            }
117 
-
118 
-            .pahang-barat {
119 
-                fill: #427bba;
120 
-            }
121 
-
122 
-            .pahang-tengah {
123 
-                fill: #144172;
124 
-            }
125 
-
126 
-            .pahang-timur {
127 
-                fill: #0c6088;
128 
-            }
129 
-
130 
-            .label-text {
131 
-                font-size: 35px;
132 
-                fill: white;
133 
-                transform: translate(0,
134 
-                        3px);
135 
-                /* adjust vertical position to centre text */
136 
-            }
137 
-
138 
-            .label-text-cameron {
139 
-                font-size: 20px;
140 
-                fill: white;
141 
-                transform: translate(0,
142 
-                        3px);
143 
-                /* adjust vertical position to centre text */
144 
-            }
145 
-
146 
-
147 
-        }
148 
-    </style>
149 
-
150 
-</head>
151 
-
152 
-<body>
153 
-
154 
-    <section class="section" style="max-height: 100vh;">
155 
-
156 
-        <div class=""
157 
-            style="background-color: #1F3F6D; min-height: 50px; display: flex; align-items: center;padding-left: 100px;">
158 
-            <h6 style="color: white;margin-right: 1em;" class=""><a style="color: white;" href="testing.html"><i
159 
-                        class="fas fa-chevron-left"></i></a></h6>
160 
-            <h6 style="color: white;">Jerantut</h6>
161 
-        </div>
162 
-
163 
-        <div class="text-center pt-5"
164 
-            style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
165 
-            <h5 style="font-weight: 500;">Perbadanan Setiausaha Kejaraan Pahang</h5>
166 
-
167 
-        </div>
168 
-
169 
-        <div class="text-center pt-1 pb-5"
170 
-            style="background-color: white;display: flex; justify-content: center; align-items: center;margin-left: -150px;">
171 
-            <div class="pt-5 pb-5" style="width: 600px;height: 100px;">
172 
-                <!-- <img style="border-radius: 20px;" src="image.png" alt=""> -->
173 
-
174 
-                <div id="map" style="width: 800px;"></div>
175 
-                <!-- <div id="capture"></div> -->
176 
-
177 
-
178 
-
179 
-            </div>
180 
-        </div>
181 
-
182 
-
183 
-
184 
-
185 
-        <div class="text-center pt-5"
186 
-            style="background-color: white; display: flex; justify-content: center; align-items: left; padding-left: 100px; margin-top: 250px;">
187 
-            <div style="display: flex; flex-direction: row;">
188 
-                <div>
189 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Lokasi :</span> <span
190 
-                            style="color: #ACACAC;">Gambangs</span></h6>
191 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Mukim :</span> <span
192 
-                            style="color: #ACACAC;">Ulu Lepar</span></h6>
193 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Daerah :</span> <span
194 
-                            style="color: #ACACAC;">Kuantan</span></h6>
195 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Negeri :</span> <span
196 
-                            style="color: #ACACAC;">Pahang Darul Makmur</span></h6>
197 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Skala :</span> <span
198 
-                            style="color: #ACACAC;">Tanpa Skala</span></h6>
199 
-                </div>
200 
-                <div style="margin-left: 100px;">
201 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">No. Hak Milik :</span>
202 
-                        <span style="color: #ACACAC;">HSD 62438</span>
203 
-                    </h6>
204 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Keluasan (MP) :</span>
205 
-                        <span style="color: #ACACAC;">607280</span>
206 
-                    </h6>
207 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Kehunaan :</span> <span
208 
-                            style="color: #ACACAC;">Bangunan</span></h6>
209 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;">Start Neat :</span>
210 
-                        <span style="color: #ACACAC;">Pembangunan Bercampur</span>
211 
-                    </h6>
212 
-                    <h6 class="pt-1" style="text-align: left;"><span style="font-weight: bold;"></span> <span
213 
-                            style="color: #ACACAC;"></span></h6>
214 
-                </div>
215 
-            </div>
216 
-        </div>
217 
-
218 
-        <div class="text-center pt-5 pb-5"
219 
-            style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
220 
-            <a href="view_pdf.html" class="button-23 mb-2 mr-2"
221 
-                style="background-color: #1F9027; color: white; border: none;width: 200px;" role="button"
222 
-                data-toggle="modal" data-target="#exampleModal">View
223 
-                PDF</a>
224 
-
225 
-        </div>
226 
-
227 
-        <script src="js/jquery-3.7.1.js" defer></script>
228 
-
229 
-        <script src="js/pdfjs-viewer.js" defer></script>
230 
-        <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.6.347/pdf.min.js"
231 
-            integrity="sha512-Z8CqofpIcnJN80feS2uccz+pXWgZzeKxDsDNMD/dJ6997/LSRY+W4NmEt9acwR+Gt9OHN0kkI1CTianCwoqcjQ=="
232 
-            crossorigin="anonymous" referrerpolicy="no-referrer" defer></script>
233 
-
234 
-    </section>
235 
-
236 
-
237 
-    <!-- <div id="map"></div> -->
238 
-
239 
-    <script>
240 
-        var map;
241 
-        var src = 'https://file.io/t3IwR1hlxwkZ';
242 
-
243 
-        function initMap() {
244 
-            map = new google.maps.Map(document.getElementById('map'), {
245 
-                center: new google.maps.LatLng(-19.257753, 146.823688),
246 
-                zoom: 2,
247 
-                mapTypeId: 'satellite'
248 
-            });
249 
-
250 
-            var kmlLayer = new google.maps.KmlLayer(src, {
251 
-                suppressInfoWindows: true,
252 
-                preserveViewport: false,
253 
-                map: map
254 
-            });
255 
-        }
256 
-
257 
-
258 
-
259 
-
260 
-
261 
-    </script>
262 
-    <script async
263 
-        src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCj5eAmQOg6IhdABVPCBT6ubZ3Yj_IWejI&callback=initMap">
264 
-        </script>
265 
-
266 
-</body>
267 
-
268 
-</html>

details/bentong.html → details/penternakan_hsd_19372.html 查看文件 

@@ -5,147 +5,10 @@
5 5 
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
6 6 
     <meta charset="utf-8">
7 7 
     <title>KML Click Capture Sample</title>
8 
-    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
9 
-    <script src="node_modules/bootstrap/dist/js/bootstrap.min.js" defer></script>
10 
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
11 
-        integrity="sha512-abc123..." crossorigin="anonymous" />
12 
-
13 
-
14 
-
15 
-    <style>
16 
-        html,
17 
-        body {
18 
-            height: 370px;
19 
-            padding: 0;
20 
-            margin: 0;
21 
-        }
22 
-
23 
-        #map {
24 
-            height: 360px;
25 
-            width: 300px;
26 
-            overflow: hidden;
27 
-            float: left;
28 
-            border: thin solid #333;
29 
-        }
30 
-
31 
-        #capture {
32 
-            height: 360px;
33 
-            width: 480px;
34 
-            overflow: hidden;
35 
-            float: left;
36 
-            background-color: #ECECFB;
37 
-            border: thin solid #333;
38 
-            border-left: none;
39 
-        }
40 
-
41 
-        #pdfViewer {
42 
-            width: 100%;
43 
-            height: 600px;
44 
-        }
45 
-    </style>
46 
-
47 
-    <style>
48 
-        /* CSS */
49 
-        .button-23 {
50 
-            background-color: #FFFFFF;
51 
-            border: 1px solid #222222;
52 
-            border-radius: 8px;
53 
-            box-sizing: border-box;
54 
-            color: #222222;
55 
-            cursor: pointer;
56 
-            display: inline-block;
57 
-            font-family: Circular, -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
58 
-            font-size: 16px;
59 
-            font-weight: 600;
60 
-            line-height: 20px;
61 
-            margin: 0;
62 
-            outline: none;
63 
-            padding: 13px 23px;
64 
-            position: relative;
65 
-            text-align: center;
66 
-            text-decoration: none;
67 
-            touch-action: manipulation;
68 
-            transition: box-shadow .2s, -ms-transform .1s, -webkit-transform .1s, transform .1s;
69 
-            user-select: none;
70 
-            -webkit-user-select: none;
71 
-            width: auto;
72 
-        }
73 
-
74 
-        .button-23:focus-visible {
75 
-            box-shadow: #222222 0 0 0 2px, rgba(255, 255, 255, 0.8) 0 0 0 4px;
76 
-            transition: box-shadow .2s;
77 
-        }
78 
-
79 
-        .button-23:active {
80 
-            background-color: #F7F7F7;
81 
-            border-color: #000000;
82 
-            transform: scale(.96);
83 
-        }
84 
-
85 
-        .button-23:disabled {
86 
-            border-color: #DDDDDD;
87 
-            color: #DDDDDD;
88 
-            cursor: not-allowed;
89 
-            opacity: 1;
90 
-        }
91 
-
92 
-        .map-svg {
93 
-            display: block;
94 
-            margin: 0 auto;
95 
-            filter: drop-shadow(-16px 11px 2px rgba(0, 0, 0, 0.5));
96 
-
97 
-            a {
98 
-                transition: all 1s;
99 
-                transform-origin: 50% 50%;
100 
-                text-decoration: none;
101 
-                filter: drop-shadow(3px 10px 5px rgb(0 0 0 / 0.4));
102 
-
103 
-                @media only screen and (min-width: 992px) {
104 
-
105 
-                    polygon,
106 
-                    &:hover {
107 
-                        cursor: pointer;
108 
-                        transform: scale(1.05);
109 
-                        filter: drop-shadow(0px 15px 12px rgb(0 0 0 / 0.7));
110 
-
111 
-                        .st0 {
112 
-                            fill: $dark-default;
113 
-                        }
114 
-                    }
115 
-                }
116 
-            }
117 
-
118 
-            .pahang-barat {
119 
-                fill: #427bba;
120 
-            }
121 
-
122 
-            .pahang-tengah {
123 
-                fill: #144172;
124 
-            }
125 
-
126 
-            .pahang-timur {
127 
-                fill: #0c6088;
128 
-            }
129 
-
130 
-            .label-text {
131 
-                font-size: 35px;
132 
-                fill: white;
133 
-                transform: translate(0,
134 
-                        3px);
135 
-                /* adjust vertical position to centre text */
136 
-            }
137 
-
138 
-            .label-text-cameron {
139 
-                font-size: 20px;
140 
-                fill: white;
141 
-                transform: translate(0,
142 
-                        3px);
143 
-                /* adjust vertical position to centre text */
144 
-            }
145 
-
146 
-
147 
-        }
148 
-    </style>
8 
+    <link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.min.css">
9 
+    <script src="../node_modules/bootstrap/dist/js/bootstrap.min.js" defer></script>
10 
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-abc123..." crossorigin="anonymous" />
11 
+    <link rel="stylesheet" href="../css/app.css">
149 12
150 13 
 </head>
151 14 
 
@@ -155,7 +18,7 @@
155 18
156 19 
         <div class=""
157 20 
             style="background-color: #1F3F6D; min-height: 50px; display: flex; align-items: center;padding-left: 100px;">
158 
-            <h6 style="color: white;margin-right: 1em;" class=""><a style="color: white;" href="../index.html"><i
21 
+            <h6 style="color: white;margin-right: 1em;" class=""><a style="color: white;" href="../lists/bentong.html"><i
159 22 
                         class="fas fa-chevron-left"></i></a></h6>
160 23 
             <h6 style="color: white;">Bentong</h6>
161 24 
         </div>
 
@@ -174,8 +37,6 @@
174 37 
                 <div id="map" style="width: 800px;"></div>
175 38 
                 <!-- <div id="capture"></div> -->
176 39
177 
-
178 
-
179 40 
             </div>
180 41 
         </div>
181 42 
 
@@ -217,7 +78,7 @@
217 78
218 79 
         <div class="text-center pt-5 pb-5"
219 80 
             style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
220 
-            <a href="view_pdf.html" class="button-23 mb-2 mr-2"
81 
+            <a href="../pdf_pages/hsd_19372.html" class="button-23 mb-2 mr-2"
221 82 
                 style="background-color: #1F9027; color: white; border: none;width: 200px;" role="button"
222 83 
                 data-toggle="modal" data-target="#exampleModal">View
223 84 
                 PDF</a>

+ 16
- 143
lists/bentong.html 查看文件 

@@ -9,7 +9,7 @@
9 9 
     <!-- include bulma css -->
10 10 
     <link rel="stylesheet" href="bulma/css/bulma.min.css">
11 11 
     <title>My Test App</title>
12 
-    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
12 
+    <link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.min.css">
13 13 
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-abc123..." crossorigin="anonymous" />
14 14 
     <link rel="stylesheet" href="../css/app.css">
15 15 
 
@@ -27,14 +27,8 @@
27 27
28 28 
         <div class="text-center pt-5"
29 29 
             style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
30 
-            <button id="pembangun_btn" type="button" class="p-1"
31 
-                style="font-weight: 500; border-top: 4px solid #BF3030; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Pembangunan&emsp;&emsp;</button>
32 30 
             <button id="penternakan_btn" type="button" class="p-1"
33 31 
                 style="font-weight: 500; border-top: 4px solid #3B47E0; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Penternakan&emsp;&emsp;</button>
34 
-            <button id="pertanian_btn" type="button" class="p-1"
35 
-                style="font-weight: 500; border-top: 4px solid #E2E236; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Pertanian&emsp;&emsp;</button>
36 
-            <button id="industri_btn" type="button" class="p-1"
37 
-                style="font-weight: 500; border-top: 4px solid #32A740; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Industri&emsp;&emsp;</button>
38 32 
         </div>
39 33
40 34 
         <div class="text-center pt-1"
 
@@ -44,28 +38,18 @@
44 38 
                     xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-30 -30 1150 1150"
45 39 
                     style="enable-background: new 0 0 1080 1080" xml:space="preserve">
46 40 
                     <g>
47 
-                        <a href="testing.html" data-area="jerantut">
48 
-                            <path id="jerantut" class="pahang-barat" d="M431.5,110.2c5.4,5.9,6.4,12.3,2.5,19.5c-3.7,6.8-4.5,14.3-3.7,21.9h0c6.1,6.2,11.1,12-3.4,12.9
49 
-                                        c-4.7,0.3-7.1,4.1-9.8,7.3c-3.3,9.5-3.4,18.6,2.6,27.4c4.8,7.1,2.7,15.3,3.2,23.1c6.7,4.2,9.9,10.2,9.4,18.1c0,0.4-0.1,0.9,0,1.3
50 
-                                        c10.5,20.1,4.7,41.2,3.7,62c3.3,0.8,6.6,1.5,9.9,2.3c7.1,1.7,16,3.6,16.1,11.6c0.1,7.7-5.5,14.9-13.2,18.9c-4.1,2.1-8.1,4.6-12.5,6
51 
-                                        c-7.9,2.5-18.2,1.9-15.2,15.6c0.5,2.3-6.1,5.6-8,2.5c-6.5-10.5-22-8.4-27-20.7c-2.8-6.9-11.3-6.5-16.5-10.9c-3.7-3.2-7.2-0.5-7,4.7
52 
-                                        c0.1,2.9,0.7,5.8,1,8.7c1.1,4.1,2.7,7.5,6.1,10.6c8.4,7.6,7.2,14.4-2.8,19.2c-1.9,0.9-3.9,1.4-5.9,2.1c-21.4,6.9-22.1,9.7-4.7,25.1
53 
-                                        c6,5.3,8.7,9.3,0.1,14c-0.5,3.7-0.3,7.7-1.6,11.1c-3.6,9.5,3.7,13.5,8.9,11.1c15.5-7.3,33.5-5.8,48.3-14.7c0,0,0,0,0,0
54 
-                                        c0.8-5.5,3.8-8.5,9.4-7.2c5.9,1.4,7.7,5.6,6.9,11.5c-0.6,4.5-0.6,9.1-0.9,13.7c0,0,0,0,0,0c4.4,1,8.2-1.1,12.2-2.3
55 
-                                        c3.7-1.1,9.5-2.2,10.5,1.2c4.4,13.6,15.3,8.5,23.6,8.4c9.1-0.2,14.2,3.1,16.9,11.3c0.5,1.6,1.3,3.1,2.2,4.5
56 
-                                        c3.7,5.7,4.8,16.6,12.2,15.5c7-1,11.5-10.1,16-16.9c7.6-11.4,9.9-23.7,8.1-37c-0.7-5.4,0.2-10.7,7.1-11c6.5-0.3,11.1,2.7,12.9,9.6
57 
-                                        c1,3.9-2,10,5,11.3c0,0,0,0,0,0c7.8-9.7,17.1-3.1,25.9-2.3c0,0,0,0,0,0c9.3-10.9,18.8-4,28.3-1.1c0.9,0,2,0.4,3.1,0.8
58 
-                                        c10.6-0.9,20.1,8.8,31.2,3.3c15.2-9,12.5-28.7,24.3-40.1c5.4-5.2,11.4-9.6,16.9-14.7c5.9-5.6,10.6,1.1,13.3,6.4
59 
-                                        c4.9,9.6,10.1,7.4,12.2-0.6c4.4-16.9,14.8-26.4,31.2-30.2c1.5-3.4,3.2-6.9,1.2-10.6c-6-11.1-1.7-19.8,6.2-27.7c0,0,0,0,0,0
60 
-                                        c-3.8-3.3-7.7-6.5-11.2-10.1c-3.6-3.6-5.9-9.1-1.6-12.4c10.9-8.4,9.7-18.2,6-29.2c-1.3-3.9,1.5-7.3,3.7-10.4
61 
-                                        c2.5-3.5,4.2-7.3,3.4-11.8c-1.1-6.5,1.8-11.4,6.7-15.5c2.9-2.4,6.2-4.9,6.9-8.9c2.2-12.1,8.6-17.9,24.1-13.2
62 
-                                        c-4.2-8.1-7.4-14.8-3.2-20.1c12.5-15.7,0.6-26.4-7.1-37.8c-5.6-8.2-13-10.7-23.1-5.7c-9.3,4.6-20.1,5.9-28.9-0.9
63 
-                                        c-10.7-8.2-17.2-19.4-18.1-33.4c-0.4-6.2-1.4-12,7.1-13.5c4.7-0.8,6.7-3.9,4-8.3c-2.6-4.2-1.9-7.1,2.2-9.4c1.8-1,3.6-1.8,3.3-4.6
64 
-                                        c-1.7-15.9-19.5-28.8-35.8-25.6c-3.4,0.7-6.5,1.3-10,0.6c-21.3-4.2-39.7-13-51.6-32.3c-2.2-3.6-5.3-7-9.6-7.8
65 
-                                        c-5.9-1.2-10.9-10.1-16.8-4.9c-5.9,5.2-2.8,13.2-0.6,20.2c1.5,4.6,4.9,10,0.1,14.1c-4.1,3.5-10.8,3.2-14.5,0.9
66 
-                                        c-10.1-6.3-14.5-0.7-20.1,6.4c-8.4,10.4-13.2,10.3-23,1.2c-2.5-2.3-4.6-5-6.9-7.4c-7.6-7.9-33.2-11.8-42.8-6.8
67 
-                                        c-3.7,1.9-2.3,4.5-2.2,7.4c0.2,12.7-10,19.1-17.9,26c-6.4,5.5-13.4-0.5-19.5-4.2c-13.3-8-23.5-3.9-28.1,11c0,0,0,0,0,0
68 
-                                        C414.2,86.1,420.9,98.6,431.5,110.2z" />
41 
+                        <a href="#" data-area="jerantut">
42 
+                            <path id="jerantut" class="pahang-barat" d="M442.5,743.9c-7.8-2.7-7.4-11.3-4.9-12.5c14.5-7.3,7-22,11.8-32.4c2.1-4.5,1.4-8.7,7.8-10.3
43 
+                            c5.5-1.4,9.2-6.8,7.6-12.6c-1.3-4.6-5.4-5.9-10-2.5c-0.8,0.6-4-0.2-4.3-1.1c-5.3-13.5-22.2-9.5-29.6-19.6c-1.8-2.5-3.7-1.4-5.4-0.1
44 
+                            c-10.7,7.6-23.6,8.6-35.6,12.2c0,0,0,0,0,0c-12.3,7.4-15.5-1-18-10.4c-9.7-10.7-3.6-22.8-1.8-33.8c1.8-10.7-1.8-15.4-11.1-17.1
45 
+                            c-8.3-1.5-12.3-5.1-12.4-14.2c-0.1-12.6-7.7-18.9-20.4-19c0,0,0,0,0,0c-0.8-0.3-1.6-0.6-2.4-0.8c-5.7-1-10.3-2-14-3.3
46 
+                            c0.4,0.2,0.8,0.4,1.3,0.6c-1.5-0.2-2.9-0.8-4.2-1.7c-9.3-4.3-11.8-11.8-14.1-29.2c-0.3-2-1.4-4-2.1-5.9c0,0,0,0,0,0
47 
+                            c-3.5-8.3-11.4-6.4-17.9-7.7c0,0,0,0,0,0c0,0,0,0,0,0c-1,0.1-2,0.1-3,0.2c-1.2,8.2-9,9.4-14.1,9.6c-8.8,0.3-13.6,5.3-18.8,10.5
48 
+                            c0,0,0,0,0,0c0.1,1.7,0.5,3.5,0.1,5.1c-2.9,10.8,1.6,24-13.7,30.8c-9.7,4.3-10.3,17.9-5.6,28c4.6,9.8,12.9,22,4.5,30.7
49 
+                            c-10.8,11.1-9.7,18.2-0.4,27.9c3.5,3.6,6.3,8,8.6,12.5c5.8,11.3,16.2,17.2,26.7,22.5c8.6,4.3,18.9,5.9,27.4,1.8
50 
+                            c13.6-6.6,23-4.5,29.3,9.7c2.5,5.8,6.4,9.3,12.6,8.6c15-1.9,21.6,4.7,23.2,19.4c0.8,7.7,4.4,12.6,13,4.3
51 
+                            c11.7-11.4,22.6-11,34.6-0.8c3.4,2.9,7.3,4.2,11.4,5.4c12.6,3.8,25.2,7.3,37.7,11.3c4.3,1.4,8.2,2,12-0.9
52 
+                            C454.9,750.5,448.9,746.1,442.5,743.9z" />
69 53 
                         </a>
70 54 
                     </g>
71 55 
                 </svg>
 
@@ -74,39 +58,7 @@
74 58 
             </div>
75 59 
         </div>
76 60
77 
-
78 
-        <div id="pembangun_plot" class="content-div">
79 
-            <div class="text-center pt-5"
80 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
81 
-                <h6>Pembangunan</h6><br>
82 
-
83 
-            </div>
84 
-            <div class="text-center pt-2 text-nowrap flex-wrap"
85 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
86 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
87 
-                    role="button">HSD 23453</a>
88 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
89 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
90 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
91 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
92 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
93 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
94 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
95 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
96 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
97 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
98 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
99 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
100 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
101 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
102 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
103 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
104 
-                <a href="detail.html" class="button-23 mb-2"
105 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
106 
-            </div>
107 
-        </div>
108 
-
109 
-        <div id="penternakan_plot" class="hidden content-div">
61 
+        <div id="penternakan_plot" class="content-div">
110 62 
             <div class="text-center pt-5"
111 63 
                 style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
112 64 
                 <h6>Penternakan</h6><br>
 
@@ -114,90 +66,11 @@
114 66 
             </div>
115 67 
             <div class="text-center pt-2 text-nowrap flex-wrap"
116 68 
                 style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
117 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
118 
-                    role="button">HSD 23453</a>
119 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
120 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
121 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
122 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
123 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
124 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
125 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
126 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
127 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
128 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
129 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
130 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
131 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
132 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
133 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
134 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
135 
-                <a href="detail.html" class="button-23 mb-2"
136 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
137 
-            </div>
138 
-        </div>
139 
-
140 
-        <div id="industri_plot" class="hidden content-div">
141 
-            <div class="text-center pt-5"
142 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
143 
-                <h6>Industri</h6><br>
144 
-
145 
-            </div>
146 
-            <div class="text-center pt-2 flex-wrap"
147 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
148 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
149 
-                    role="button">HSD 23453</a>
150 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
151 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23sss453</a>
152 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
153 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
154 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
155 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
156 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
157 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
158 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
159 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
160 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
161 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
162 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
163 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
164 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
165 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
166 
-                <a href="detail.html" class="button-23 mb-2"
167 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
69 
+                <a href="../details/penternakan_hsd_19372.html" class="button-23 mb-2 mr-2"
70 
+                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 19372</a>
168 71 
             </div>
169 72 
         </div>
170 73
171 
-        <div id="pertanian_plot" class="hidden content-div">
172 
-            <div class="text-center pt-5"
173 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
174 
-                <h6>Pertanian</h6><br>
175 
-
176 
-            </div>
177 
-            <div class="text-center pt-2 text-nowrap flex-wrap"
178 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
179 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
180 
-                    role="button">HSD 23453</a>
181 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
182 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
183 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
184 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
185 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
186 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
187 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
188 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
189 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
190 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
191 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
192 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
193 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
194 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
195 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
196 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
197 
-                <a href="detail.html" class="button-23 mb-2"
198 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
199 
-            </div>
200 
-        </div>
201 74
202 75 
     </section>
203 76

+ 0
- 234
lists/bera.html 查看文件 

@@ -1,234 +0,0 @@
1 
-<!DOCTYPE html>
2 
-<html>
3 
-
4 
-<head>
5 
-    <meta charset="UTF-8">
6 
-    <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
7 
-    <!-- CSP is a PITA ;). Disabled, don't try this at home!-->
8 
-    <meta http-equiv="Content-Security-Policy" content="">
9 
-    <!-- include bulma css -->
10 
-    <link rel="stylesheet" href="bulma/css/bulma.min.css">
11 
-    <title>My Test App</title>
12 
-    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
13 
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-abc123..." crossorigin="anonymous" />
14 
-    <link rel="stylesheet" href="../css/app.css">
15 
-
16 
-</head>
17 
-
18 
-<body>
19 
-    <section class="section" style="max-height: 100vh;">
20 
-
21 
-        <div class=""
22 
-            style="background-color: #1F3F6D; min-height: 50px; display: flex; align-items: center;padding-left: 100px;">
23 
-            <h6 style="color: white;margin-right: 1em;" class=""><a style="color: white;" href="../index.html"><i
24 
-                        class="fas fa-chevron-left"></i></a></h6>
25 
-            <h6 style="color: white;">Bera</h6>
26 
-        </div>
27 
-
28 
-        <div class="text-center pt-5"
29 
-            style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
30 
-            <button id="pembangun_btn" type="button" class="p-1"
31 
-                style="font-weight: 500; border-top: 4px solid #BF3030; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Pembangunan&emsp;&emsp;</button>
32 
-            <button id="penternakan_btn" type="button" class="p-1"
33 
-                style="font-weight: 500; border-top: 4px solid #3B47E0; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Penternakan&emsp;&emsp;</button>
34 
-            <button id="pertanian_btn" type="button" class="p-1"
35 
-                style="font-weight: 500; border-top: 4px solid #E2E236; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Pertanian&emsp;&emsp;</button>
36 
-            <button id="industri_btn" type="button" class="p-1"
37 
-                style="font-weight: 500; border-top: 4px solid #32A740; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Industri&emsp;&emsp;</button>
38 
-        </div>
39 
-
40 
-        <div class="text-center pt-1"
41 
-            style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
42 
-            <div class="pt-5" style="width: 600px;height: 100px;">
43 
-                <svg class="map-svg" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"
44 
-                    xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-30 -30 1150 1150"
45 
-                    style="enable-background: new 0 0 1080 1080" xml:space="preserve">
46 
-                    <g>
47 
-                        <a href="testing.html" data-area="jerantut">
48 
-                            <path id="jerantut" class="pahang-barat" d="M431.5,110.2c5.4,5.9,6.4,12.3,2.5,19.5c-3.7,6.8-4.5,14.3-3.7,21.9h0c6.1,6.2,11.1,12-3.4,12.9
49 
-                                        c-4.7,0.3-7.1,4.1-9.8,7.3c-3.3,9.5-3.4,18.6,2.6,27.4c4.8,7.1,2.7,15.3,3.2,23.1c6.7,4.2,9.9,10.2,9.4,18.1c0,0.4-0.1,0.9,0,1.3
50 
-                                        c10.5,20.1,4.7,41.2,3.7,62c3.3,0.8,6.6,1.5,9.9,2.3c7.1,1.7,16,3.6,16.1,11.6c0.1,7.7-5.5,14.9-13.2,18.9c-4.1,2.1-8.1,4.6-12.5,6
51 
-                                        c-7.9,2.5-18.2,1.9-15.2,15.6c0.5,2.3-6.1,5.6-8,2.5c-6.5-10.5-22-8.4-27-20.7c-2.8-6.9-11.3-6.5-16.5-10.9c-3.7-3.2-7.2-0.5-7,4.7
52 
-                                        c0.1,2.9,0.7,5.8,1,8.7c1.1,4.1,2.7,7.5,6.1,10.6c8.4,7.6,7.2,14.4-2.8,19.2c-1.9,0.9-3.9,1.4-5.9,2.1c-21.4,6.9-22.1,9.7-4.7,25.1
53 
-                                        c6,5.3,8.7,9.3,0.1,14c-0.5,3.7-0.3,7.7-1.6,11.1c-3.6,9.5,3.7,13.5,8.9,11.1c15.5-7.3,33.5-5.8,48.3-14.7c0,0,0,0,0,0
54 
-                                        c0.8-5.5,3.8-8.5,9.4-7.2c5.9,1.4,7.7,5.6,6.9,11.5c-0.6,4.5-0.6,9.1-0.9,13.7c0,0,0,0,0,0c4.4,1,8.2-1.1,12.2-2.3
55 
-                                        c3.7-1.1,9.5-2.2,10.5,1.2c4.4,13.6,15.3,8.5,23.6,8.4c9.1-0.2,14.2,3.1,16.9,11.3c0.5,1.6,1.3,3.1,2.2,4.5
56 
-                                        c3.7,5.7,4.8,16.6,12.2,15.5c7-1,11.5-10.1,16-16.9c7.6-11.4,9.9-23.7,8.1-37c-0.7-5.4,0.2-10.7,7.1-11c6.5-0.3,11.1,2.7,12.9,9.6
57 
-                                        c1,3.9-2,10,5,11.3c0,0,0,0,0,0c7.8-9.7,17.1-3.1,25.9-2.3c0,0,0,0,0,0c9.3-10.9,18.8-4,28.3-1.1c0.9,0,2,0.4,3.1,0.8
58 
-                                        c10.6-0.9,20.1,8.8,31.2,3.3c15.2-9,12.5-28.7,24.3-40.1c5.4-5.2,11.4-9.6,16.9-14.7c5.9-5.6,10.6,1.1,13.3,6.4
59 
-                                        c4.9,9.6,10.1,7.4,12.2-0.6c4.4-16.9,14.8-26.4,31.2-30.2c1.5-3.4,3.2-6.9,1.2-10.6c-6-11.1-1.7-19.8,6.2-27.7c0,0,0,0,0,0
60 
-                                        c-3.8-3.3-7.7-6.5-11.2-10.1c-3.6-3.6-5.9-9.1-1.6-12.4c10.9-8.4,9.7-18.2,6-29.2c-1.3-3.9,1.5-7.3,3.7-10.4
61 
-                                        c2.5-3.5,4.2-7.3,3.4-11.8c-1.1-6.5,1.8-11.4,6.7-15.5c2.9-2.4,6.2-4.9,6.9-8.9c2.2-12.1,8.6-17.9,24.1-13.2
62 
-                                        c-4.2-8.1-7.4-14.8-3.2-20.1c12.5-15.7,0.6-26.4-7.1-37.8c-5.6-8.2-13-10.7-23.1-5.7c-9.3,4.6-20.1,5.9-28.9-0.9
63 
-                                        c-10.7-8.2-17.2-19.4-18.1-33.4c-0.4-6.2-1.4-12,7.1-13.5c4.7-0.8,6.7-3.9,4-8.3c-2.6-4.2-1.9-7.1,2.2-9.4c1.8-1,3.6-1.8,3.3-4.6
64 
-                                        c-1.7-15.9-19.5-28.8-35.8-25.6c-3.4,0.7-6.5,1.3-10,0.6c-21.3-4.2-39.7-13-51.6-32.3c-2.2-3.6-5.3-7-9.6-7.8
65 
-                                        c-5.9-1.2-10.9-10.1-16.8-4.9c-5.9,5.2-2.8,13.2-0.6,20.2c1.5,4.6,4.9,10,0.1,14.1c-4.1,3.5-10.8,3.2-14.5,0.9
66 
-                                        c-10.1-6.3-14.5-0.7-20.1,6.4c-8.4,10.4-13.2,10.3-23,1.2c-2.5-2.3-4.6-5-6.9-7.4c-7.6-7.9-33.2-11.8-42.8-6.8
67 
-                                        c-3.7,1.9-2.3,4.5-2.2,7.4c0.2,12.7-10,19.1-17.9,26c-6.4,5.5-13.4-0.5-19.5-4.2c-13.3-8-23.5-3.9-28.1,11c0,0,0,0,0,0
68 
-                                        C414.2,86.1,420.9,98.6,431.5,110.2z" />
69 
-                        </a>
70 
-                    </g>
71 
-                </svg>
72 
-
73 
-
74 
-            </div>
75 
-        </div>
76 
-
77 
-
78 
-        <div id="pembangun_plot" class="content-div">
79 
-            <div class="text-center pt-5"
80 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
81 
-                <h6>Pembangunan</h6><br>
82 
-
83 
-            </div>
84 
-            <div class="text-center pt-2 text-nowrap flex-wrap"
85 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
86 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
87 
-                    role="button">HSD 23453</a>
88 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
89 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
90 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
91 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
92 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
93 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
94 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
95 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
96 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
97 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
98 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
99 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
100 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
101 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
102 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
103 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
104 
-                <a href="detail.html" class="button-23 mb-2"
105 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
106 
-            </div>
107 
-        </div>
108 
-
109 
-        <div id="penternakan_plot" class="hidden content-div">
110 
-            <div class="text-center pt-5"
111 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
112 
-                <h6>Penternakan</h6><br>
113 
-
114 
-            </div>
115 
-            <div class="text-center pt-2 text-nowrap flex-wrap"
116 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
117 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
118 
-                    role="button">HSD 23453</a>
119 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
120 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
121 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
122 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
123 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
124 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
125 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
126 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
127 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
128 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
129 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
130 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
131 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
132 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
133 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
134 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
135 
-                <a href="detail.html" class="button-23 mb-2"
136 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
137 
-            </div>
138 
-        </div>
139 
-
140 
-        <div id="industri_plot" class="hidden content-div">
141 
-            <div class="text-center pt-5"
142 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
143 
-                <h6>Industri</h6><br>
144 
-
145 
-            </div>
146 
-            <div class="text-center pt-2 flex-wrap"
147 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
148 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
149 
-                    role="button">HSD 23453</a>
150 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
151 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23sss453</a>
152 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
153 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
154 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
155 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
156 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
157 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
158 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
159 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
160 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
161 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
162 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
163 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
164 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
165 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
166 
-                <a href="detail.html" class="button-23 mb-2"
167 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
168 
-            </div>
169 
-        </div>
170 
-
171 
-        <div id="pertanian_plot" class="hidden content-div">
172 
-            <div class="text-center pt-5"
173 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
174 
-                <h6>Pertanian</h6><br>
175 
-
176 
-            </div>
177 
-            <div class="text-center pt-2 text-nowrap flex-wrap"
178 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
179 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
180 
-                    role="button">HSD 23453</a>
181 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
182 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
183 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
184 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
185 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
186 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
187 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
188 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
189 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
190 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
191 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
192 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
193 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
194 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
195 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
196 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
197 
-                <a href="detail.html" class="button-23 mb-2"
198 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
199 
-            </div>
200 
-        </div>
201 
-
202 
-    </section>
203 
-
204 
-    <script>
205 
-
206 
-        document.getElementById('pembangun_btn').addEventListener('click', function () {
207 
-            showDiv('pembangun_plot');
208 
-        });
209 
-
210 
-        document.getElementById('penternakan_btn').addEventListener('click', function () {
211 
-            showDiv('penternakan_plot');
212 
-        });
213 
-
214 
-        document.getElementById('pertanian_btn').addEventListener('click', function () {
215 
-            showDiv('pertanian_plot');
216 
-        });
217 
-
218 
-        document.getElementById('industri_btn').addEventListener('click', function () {
219 
-            showDiv('industri_plot');
220 
-        });
221 
-
222 
-        function showDiv(divId) {
223 
-            var divs = document.getElementsByClassName('content-div');
224 
-            for (var i = 0; i < divs.length; i++) {
225 
-                divs[i].classList.add('hidden');
226 
-            }
227 
-            document.getElementById(divId).classList.remove('hidden');
228 
-        }
229 
-    </script>
230 
-    <script defer src="/ruta relativa a mi archivo .js"></script>
231 
-
232 
-</body>
233 
-
234 
-</html>

+ 0
- 234
lists/kuantan.html 查看文件 

@@ -1,234 +0,0 @@
1 
-<!DOCTYPE html>
2 
-<html>
3 
-
4 
-<head>
5 
-    <meta charset="UTF-8">
6 
-    <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
7 
-    <!-- CSP is a PITA ;). Disabled, don't try this at home!-->
8 
-    <meta http-equiv="Content-Security-Policy" content="">
9 
-    <!-- include bulma css -->
10 
-    <link rel="stylesheet" href="bulma/css/bulma.min.css">
11 
-    <title>My Test App</title>
12 
-    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
13 
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-abc123..." crossorigin="anonymous" />
14 
-    <link rel="stylesheet" href="../css/app.css">
15 
-
16 
-</head>
17 
-
18 
-<body>
19 
-    <section class="section" style="max-height: 100vh;">
20 
-
21 
-        <div class=""
22 
-            style="background-color: #1F3F6D; min-height: 50px; display: flex; align-items: center;padding-left: 100px;">
23 
-            <h6 style="color: white;margin-right: 1em;" class=""><a style="color: white;" href="../index.html"><i
24 
-                        class="fas fa-chevron-left"></i></a></h6>
25 
-            <h6 style="color: white;">Kuantan</h6>
26 
-        </div>
27 
-
28 
-        <div class="text-center pt-5"
29 
-            style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
30 
-            <button id="pembangun_btn" type="button" class="p-1"
31 
-                style="font-weight: 500; border-top: 4px solid #BF3030; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Pembangunan&emsp;&emsp;</button>
32 
-            <button id="penternakan_btn" type="button" class="p-1"
33 
-                style="font-weight: 500; border-top: 4px solid #3B47E0; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Penternakan&emsp;&emsp;</button>
34 
-            <button id="pertanian_btn" type="button" class="p-1"
35 
-                style="font-weight: 500; border-top: 4px solid #E2E236; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Pertanian&emsp;&emsp;</button>
36 
-            <button id="industri_btn" type="button" class="p-1"
37 
-                style="font-weight: 500; border-top: 4px solid #32A740; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Industri&emsp;&emsp;</button>
38 
-        </div>
39 
-
40 
-        <div class="text-center pt-1"
41 
-            style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
42 
-            <div class="pt-5" style="width: 600px;height: 100px;">
43 
-                <svg class="map-svg" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"
44 
-                    xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-30 -30 1150 1150"
45 
-                    style="enable-background: new 0 0 1080 1080" xml:space="preserve">
46 
-                    <g>
47 
-                        <a href="testing.html" data-area="jerantut">
48 
-                            <path id="jerantut" class="pahang-barat" d="M431.5,110.2c5.4,5.9,6.4,12.3,2.5,19.5c-3.7,6.8-4.5,14.3-3.7,21.9h0c6.1,6.2,11.1,12-3.4,12.9
49 
-                                        c-4.7,0.3-7.1,4.1-9.8,7.3c-3.3,9.5-3.4,18.6,2.6,27.4c4.8,7.1,2.7,15.3,3.2,23.1c6.7,4.2,9.9,10.2,9.4,18.1c0,0.4-0.1,0.9,0,1.3
50 
-                                        c10.5,20.1,4.7,41.2,3.7,62c3.3,0.8,6.6,1.5,9.9,2.3c7.1,1.7,16,3.6,16.1,11.6c0.1,7.7-5.5,14.9-13.2,18.9c-4.1,2.1-8.1,4.6-12.5,6
51 
-                                        c-7.9,2.5-18.2,1.9-15.2,15.6c0.5,2.3-6.1,5.6-8,2.5c-6.5-10.5-22-8.4-27-20.7c-2.8-6.9-11.3-6.5-16.5-10.9c-3.7-3.2-7.2-0.5-7,4.7
52 
-                                        c0.1,2.9,0.7,5.8,1,8.7c1.1,4.1,2.7,7.5,6.1,10.6c8.4,7.6,7.2,14.4-2.8,19.2c-1.9,0.9-3.9,1.4-5.9,2.1c-21.4,6.9-22.1,9.7-4.7,25.1
53 
-                                        c6,5.3,8.7,9.3,0.1,14c-0.5,3.7-0.3,7.7-1.6,11.1c-3.6,9.5,3.7,13.5,8.9,11.1c15.5-7.3,33.5-5.8,48.3-14.7c0,0,0,0,0,0
54 
-                                        c0.8-5.5,3.8-8.5,9.4-7.2c5.9,1.4,7.7,5.6,6.9,11.5c-0.6,4.5-0.6,9.1-0.9,13.7c0,0,0,0,0,0c4.4,1,8.2-1.1,12.2-2.3
55 
-                                        c3.7-1.1,9.5-2.2,10.5,1.2c4.4,13.6,15.3,8.5,23.6,8.4c9.1-0.2,14.2,3.1,16.9,11.3c0.5,1.6,1.3,3.1,2.2,4.5
56 
-                                        c3.7,5.7,4.8,16.6,12.2,15.5c7-1,11.5-10.1,16-16.9c7.6-11.4,9.9-23.7,8.1-37c-0.7-5.4,0.2-10.7,7.1-11c6.5-0.3,11.1,2.7,12.9,9.6
57 
-                                        c1,3.9-2,10,5,11.3c0,0,0,0,0,0c7.8-9.7,17.1-3.1,25.9-2.3c0,0,0,0,0,0c9.3-10.9,18.8-4,28.3-1.1c0.9,0,2,0.4,3.1,0.8
58 
-                                        c10.6-0.9,20.1,8.8,31.2,3.3c15.2-9,12.5-28.7,24.3-40.1c5.4-5.2,11.4-9.6,16.9-14.7c5.9-5.6,10.6,1.1,13.3,6.4
59 
-                                        c4.9,9.6,10.1,7.4,12.2-0.6c4.4-16.9,14.8-26.4,31.2-30.2c1.5-3.4,3.2-6.9,1.2-10.6c-6-11.1-1.7-19.8,6.2-27.7c0,0,0,0,0,0
60 
-                                        c-3.8-3.3-7.7-6.5-11.2-10.1c-3.6-3.6-5.9-9.1-1.6-12.4c10.9-8.4,9.7-18.2,6-29.2c-1.3-3.9,1.5-7.3,3.7-10.4
61 
-                                        c2.5-3.5,4.2-7.3,3.4-11.8c-1.1-6.5,1.8-11.4,6.7-15.5c2.9-2.4,6.2-4.9,6.9-8.9c2.2-12.1,8.6-17.9,24.1-13.2
62 
-                                        c-4.2-8.1-7.4-14.8-3.2-20.1c12.5-15.7,0.6-26.4-7.1-37.8c-5.6-8.2-13-10.7-23.1-5.7c-9.3,4.6-20.1,5.9-28.9-0.9
63 
-                                        c-10.7-8.2-17.2-19.4-18.1-33.4c-0.4-6.2-1.4-12,7.1-13.5c4.7-0.8,6.7-3.9,4-8.3c-2.6-4.2-1.9-7.1,2.2-9.4c1.8-1,3.6-1.8,3.3-4.6
64 
-                                        c-1.7-15.9-19.5-28.8-35.8-25.6c-3.4,0.7-6.5,1.3-10,0.6c-21.3-4.2-39.7-13-51.6-32.3c-2.2-3.6-5.3-7-9.6-7.8
65 
-                                        c-5.9-1.2-10.9-10.1-16.8-4.9c-5.9,5.2-2.8,13.2-0.6,20.2c1.5,4.6,4.9,10,0.1,14.1c-4.1,3.5-10.8,3.2-14.5,0.9
66 
-                                        c-10.1-6.3-14.5-0.7-20.1,6.4c-8.4,10.4-13.2,10.3-23,1.2c-2.5-2.3-4.6-5-6.9-7.4c-7.6-7.9-33.2-11.8-42.8-6.8
67 
-                                        c-3.7,1.9-2.3,4.5-2.2,7.4c0.2,12.7-10,19.1-17.9,26c-6.4,5.5-13.4-0.5-19.5-4.2c-13.3-8-23.5-3.9-28.1,11c0,0,0,0,0,0
68 
-                                        C414.2,86.1,420.9,98.6,431.5,110.2z" />
69 
-                        </a>
70 
-                    </g>
71 
-                </svg>
72 
-
73 
-
74 
-            </div>
75 
-        </div>
76 
-
77 
-
78 
-        <div id="pembangun_plot" class="content-div">
79 
-            <div class="text-center pt-5"
80 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
81 
-                <h6>Pembangunan</h6><br>
82 
-
83 
-            </div>
84 
-            <div class="text-center pt-2 text-nowrap flex-wrap"
85 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
86 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
87 
-                    role="button">HSD 23453</a>
88 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
89 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
90 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
91 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
92 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
93 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
94 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
95 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
96 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
97 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
98 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
99 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
100 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
101 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
102 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
103 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
104 
-                <a href="detail.html" class="button-23 mb-2"
105 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
106 
-            </div>
107 
-        </div>
108 
-
109 
-        <div id="penternakan_plot" class="hidden content-div">
110 
-            <div class="text-center pt-5"
111 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
112 
-                <h6>Penternakan</h6><br>
113 
-
114 
-            </div>
115 
-            <div class="text-center pt-2 text-nowrap flex-wrap"
116 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
117 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
118 
-                    role="button">HSD 23453</a>
119 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
120 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
121 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
122 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
123 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
124 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
125 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
126 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
127 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
128 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
129 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
130 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
131 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
132 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
133 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
134 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
135 
-                <a href="detail.html" class="button-23 mb-2"
136 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
137 
-            </div>
138 
-        </div>
139 
-
140 
-        <div id="industri_plot" class="hidden content-div">
141 
-            <div class="text-center pt-5"
142 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
143 
-                <h6>Industri</h6><br>
144 
-
145 
-            </div>
146 
-            <div class="text-center pt-2 flex-wrap"
147 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
148 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
149 
-                    role="button">HSD 23453</a>
150 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
151 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23sss453</a>
152 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
153 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
154 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
155 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
156 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
157 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
158 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
159 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
160 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
161 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
162 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
163 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
164 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
165 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
166 
-                <a href="detail.html" class="button-23 mb-2"
167 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
168 
-            </div>
169 
-        </div>
170 
-
171 
-        <div id="pertanian_plot" class="hidden content-div">
172 
-            <div class="text-center pt-5"
173 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
174 
-                <h6>Pertanian</h6><br>
175 
-
176 
-            </div>
177 
-            <div class="text-center pt-2 text-nowrap flex-wrap"
178 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
179 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
180 
-                    role="button">HSD 23453</a>
181 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
182 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
183 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
184 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
185 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
186 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
187 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
188 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
189 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
190 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
191 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
192 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
193 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
194 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
195 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
196 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
197 
-                <a href="detail.html" class="button-23 mb-2"
198 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
199 
-            </div>
200 
-        </div>
201 
-
202 
-    </section>
203 
-
204 
-    <script>
205 
-
206 
-        document.getElementById('pembangun_btn').addEventListener('click', function () {
207 
-            showDiv('pembangun_plot');
208 
-        });
209 
-
210 
-        document.getElementById('penternakan_btn').addEventListener('click', function () {
211 
-            showDiv('penternakan_plot');
212 
-        });
213 
-
214 
-        document.getElementById('pertanian_btn').addEventListener('click', function () {
215 
-            showDiv('pertanian_plot');
216 
-        });
217 
-
218 
-        document.getElementById('industri_btn').addEventListener('click', function () {
219 
-            showDiv('industri_plot');
220 
-        });
221 
-
222 
-        function showDiv(divId) {
223 
-            var divs = document.getElementsByClassName('content-div');
224 
-            for (var i = 0; i < divs.length; i++) {
225 
-                divs[i].classList.add('hidden');
226 
-            }
227 
-            document.getElementById(divId).classList.remove('hidden');
228 
-        }
229 
-    </script>
230 
-    <script defer src="/ruta relativa a mi archivo .js"></script>
231 
-
232 
-</body>
233 
-
234 
-</html>

+ 0
- 234
lists/lipis.html 查看文件 

@@ -1,234 +0,0 @@
1 
-<!DOCTYPE html>
2 
-<html>
3 
-
4 
-<head>
5 
-    <meta charset="UTF-8">
6 
-    <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
7 
-    <!-- CSP is a PITA ;). Disabled, don't try this at home!-->
8 
-    <meta http-equiv="Content-Security-Policy" content="">
9 
-    <!-- include bulma css -->
10 
-    <link rel="stylesheet" href="bulma/css/bulma.min.css">
11 
-    <title>My Test App</title>
12 
-    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
13 
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-abc123..." crossorigin="anonymous" />
14 
-    <link rel="stylesheet" href="../css/app.css">
15 
-
16 
-</head>
17 
-
18 
-<body>
19 
-    <section class="section" style="max-height: 100vh;">
20 
-
21 
-        <div class=""
22 
-            style="background-color: #1F3F6D; min-height: 50px; display: flex; align-items: center;padding-left: 100px;">
23 
-            <h6 style="color: white;margin-right: 1em;" class=""><a style="color: white;" href="../index.html"><i
24 
-                        class="fas fa-chevron-left"></i></a></h6>
25 
-            <h6 style="color: white;">Lips</h6>
26 
-        </div>
27 
-
28 
-        <div class="text-center pt-5"
29 
-            style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
30 
-            <button id="pembangun_btn" type="button" class="p-1"
31 
-                style="font-weight: 500; border-top: 4px solid #BF3030; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Pembangunan&emsp;&emsp;</button>
32 
-            <button id="penternakan_btn" type="button" class="p-1"
33 
-                style="font-weight: 500; border-top: 4px solid #3B47E0; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Penternakan&emsp;&emsp;</button>
34 
-            <button id="pertanian_btn" type="button" class="p-1"
35 
-                style="font-weight: 500; border-top: 4px solid #E2E236; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Pertanian&emsp;&emsp;</button>
36 
-            <button id="industri_btn" type="button" class="p-1"
37 
-                style="font-weight: 500; border-top: 4px solid #32A740; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Industri&emsp;&emsp;</button>
38 
-        </div>
39 
-
40 
-        <div class="text-center pt-1"
41 
-            style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
42 
-            <div class="pt-5" style="width: 600px;height: 100px;">
43 
-                <svg class="map-svg" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"
44 
-                    xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-30 -30 1150 1150"
45 
-                    style="enable-background: new 0 0 1080 1080" xml:space="preserve">
46 
-                    <g>
47 
-                        <a href="testing.html" data-area="jerantut">
48 
-                            <path id="jerantut" class="pahang-barat" d="M431.5,110.2c5.4,5.9,6.4,12.3,2.5,19.5c-3.7,6.8-4.5,14.3-3.7,21.9h0c6.1,6.2,11.1,12-3.4,12.9
49 
-                                        c-4.7,0.3-7.1,4.1-9.8,7.3c-3.3,9.5-3.4,18.6,2.6,27.4c4.8,7.1,2.7,15.3,3.2,23.1c6.7,4.2,9.9,10.2,9.4,18.1c0,0.4-0.1,0.9,0,1.3
50 
-                                        c10.5,20.1,4.7,41.2,3.7,62c3.3,0.8,6.6,1.5,9.9,2.3c7.1,1.7,16,3.6,16.1,11.6c0.1,7.7-5.5,14.9-13.2,18.9c-4.1,2.1-8.1,4.6-12.5,6
51 
-                                        c-7.9,2.5-18.2,1.9-15.2,15.6c0.5,2.3-6.1,5.6-8,2.5c-6.5-10.5-22-8.4-27-20.7c-2.8-6.9-11.3-6.5-16.5-10.9c-3.7-3.2-7.2-0.5-7,4.7
52 
-                                        c0.1,2.9,0.7,5.8,1,8.7c1.1,4.1,2.7,7.5,6.1,10.6c8.4,7.6,7.2,14.4-2.8,19.2c-1.9,0.9-3.9,1.4-5.9,2.1c-21.4,6.9-22.1,9.7-4.7,25.1
53 
-                                        c6,5.3,8.7,9.3,0.1,14c-0.5,3.7-0.3,7.7-1.6,11.1c-3.6,9.5,3.7,13.5,8.9,11.1c15.5-7.3,33.5-5.8,48.3-14.7c0,0,0,0,0,0
54 
-                                        c0.8-5.5,3.8-8.5,9.4-7.2c5.9,1.4,7.7,5.6,6.9,11.5c-0.6,4.5-0.6,9.1-0.9,13.7c0,0,0,0,0,0c4.4,1,8.2-1.1,12.2-2.3
55 
-                                        c3.7-1.1,9.5-2.2,10.5,1.2c4.4,13.6,15.3,8.5,23.6,8.4c9.1-0.2,14.2,3.1,16.9,11.3c0.5,1.6,1.3,3.1,2.2,4.5
56 
-                                        c3.7,5.7,4.8,16.6,12.2,15.5c7-1,11.5-10.1,16-16.9c7.6-11.4,9.9-23.7,8.1-37c-0.7-5.4,0.2-10.7,7.1-11c6.5-0.3,11.1,2.7,12.9,9.6
57 
-                                        c1,3.9-2,10,5,11.3c0,0,0,0,0,0c7.8-9.7,17.1-3.1,25.9-2.3c0,0,0,0,0,0c9.3-10.9,18.8-4,28.3-1.1c0.9,0,2,0.4,3.1,0.8
58 
-                                        c10.6-0.9,20.1,8.8,31.2,3.3c15.2-9,12.5-28.7,24.3-40.1c5.4-5.2,11.4-9.6,16.9-14.7c5.9-5.6,10.6,1.1,13.3,6.4
59 
-                                        c4.9,9.6,10.1,7.4,12.2-0.6c4.4-16.9,14.8-26.4,31.2-30.2c1.5-3.4,3.2-6.9,1.2-10.6c-6-11.1-1.7-19.8,6.2-27.7c0,0,0,0,0,0
60 
-                                        c-3.8-3.3-7.7-6.5-11.2-10.1c-3.6-3.6-5.9-9.1-1.6-12.4c10.9-8.4,9.7-18.2,6-29.2c-1.3-3.9,1.5-7.3,3.7-10.4
61 
-                                        c2.5-3.5,4.2-7.3,3.4-11.8c-1.1-6.5,1.8-11.4,6.7-15.5c2.9-2.4,6.2-4.9,6.9-8.9c2.2-12.1,8.6-17.9,24.1-13.2
62 
-                                        c-4.2-8.1-7.4-14.8-3.2-20.1c12.5-15.7,0.6-26.4-7.1-37.8c-5.6-8.2-13-10.7-23.1-5.7c-9.3,4.6-20.1,5.9-28.9-0.9
63 
-                                        c-10.7-8.2-17.2-19.4-18.1-33.4c-0.4-6.2-1.4-12,7.1-13.5c4.7-0.8,6.7-3.9,4-8.3c-2.6-4.2-1.9-7.1,2.2-9.4c1.8-1,3.6-1.8,3.3-4.6
64 
-                                        c-1.7-15.9-19.5-28.8-35.8-25.6c-3.4,0.7-6.5,1.3-10,0.6c-21.3-4.2-39.7-13-51.6-32.3c-2.2-3.6-5.3-7-9.6-7.8
65 
-                                        c-5.9-1.2-10.9-10.1-16.8-4.9c-5.9,5.2-2.8,13.2-0.6,20.2c1.5,4.6,4.9,10,0.1,14.1c-4.1,3.5-10.8,3.2-14.5,0.9
66 
-                                        c-10.1-6.3-14.5-0.7-20.1,6.4c-8.4,10.4-13.2,10.3-23,1.2c-2.5-2.3-4.6-5-6.9-7.4c-7.6-7.9-33.2-11.8-42.8-6.8
67 
-                                        c-3.7,1.9-2.3,4.5-2.2,7.4c0.2,12.7-10,19.1-17.9,26c-6.4,5.5-13.4-0.5-19.5-4.2c-13.3-8-23.5-3.9-28.1,11c0,0,0,0,0,0
68 
-                                        C414.2,86.1,420.9,98.6,431.5,110.2z" />
69 
-                        </a>
70 
-                    </g>
71 
-                </svg>
72 
-
73 
-
74 
-            </div>
75 
-        </div>
76 
-
77 
-
78 
-        <div id="pembangun_plot" class="content-div">
79 
-            <div class="text-center pt-5"
80 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
81 
-                <h6>Pembangunan</h6><br>
82 
-
83 
-            </div>
84 
-            <div class="text-center pt-2 text-nowrap flex-wrap"
85 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
86 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
87 
-                    role="button">HSD 23453</a>
88 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
89 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
90 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
91 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
92 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
93 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
94 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
95 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
96 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
97 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
98 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
99 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
100 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
101 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
102 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
103 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
104 
-                <a href="detail.html" class="button-23 mb-2"
105 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
106 
-            </div>
107 
-        </div>
108 
-
109 
-        <div id="penternakan_plot" class="hidden content-div">
110 
-            <div class="text-center pt-5"
111 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
112 
-                <h6>Penternakan</h6><br>
113 
-
114 
-            </div>
115 
-            <div class="text-center pt-2 text-nowrap flex-wrap"
116 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
117 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
118 
-                    role="button">HSD 23453</a>
119 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
120 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
121 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
122 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
123 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
124 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
125 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
126 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
127 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
128 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
129 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
130 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
131 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
132 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
133 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
134 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
135 
-                <a href="detail.html" class="button-23 mb-2"
136 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
137 
-            </div>
138 
-        </div>
139 
-
140 
-        <div id="industri_plot" class="hidden content-div">
141 
-            <div class="text-center pt-5"
142 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
143 
-                <h6>Industri</h6><br>
144 
-
145 
-            </div>
146 
-            <div class="text-center pt-2 flex-wrap"
147 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
148 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
149 
-                    role="button">HSD 23453</a>
150 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
151 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23sss453</a>
152 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
153 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
154 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
155 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
156 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
157 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
158 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
159 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
160 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
161 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
162 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
163 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
164 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
165 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
166 
-                <a href="detail.html" class="button-23 mb-2"
167 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
168 
-            </div>
169 
-        </div>
170 
-
171 
-        <div id="pertanian_plot" class="hidden content-div">
172 
-            <div class="text-center pt-5"
173 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
174 
-                <h6>Pertanian</h6><br>
175 
-
176 
-            </div>
177 
-            <div class="text-center pt-2 text-nowrap flex-wrap"
178 
-                style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
179 
-                <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"
180 
-                    role="button">HSD 23453</a>
181 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
182 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
183 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
184 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
185 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
186 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
187 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
188 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
189 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
190 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
191 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
192 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
193 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
194 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
195 
-                <a href="detail.html" class="button-23 mb-2 mr-2"
196 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
197 
-                <a href="detail.html" class="button-23 mb-2"
198 
-                    style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
199 
-            </div>
200 
-        </div>
201 
-
202 
-    </section>
203 
-
204 
-    <script>
205 
-
206 
-        document.getElementById('pembangun_btn').addEventListener('click', function () {
207 
-            showDiv('pembangun_plot');
208 
-        });
209 
-
210 
-        document.getElementById('penternakan_btn').addEventListener('click', function () {
211 
-            showDiv('penternakan_plot');
212 
-        });
213 
-
214 
-        document.getElementById('pertanian_btn').addEventListener('click', function () {
215 
-            showDiv('pertanian_plot');
216 
-        });
217 
-
218 
-        document.getElementById('industri_btn').addEventListener('click', function () {
219 
-            showDiv('industri_plot');
220 
-        });
221 
-
222 
-        function showDiv(divId) {
223 
-            var divs = document.getElementsByClassName('content-div');
224 
-            for (var i = 0; i < divs.length; i++) {
225 
-                divs[i].classList.add('hidden');
226 
-            }
227 
-            document.getElementById(divId).classList.remove('hidden');
228 
-        }
229 
-    </script>
230 
-    <script defer src="/ruta relativa a mi archivo .js"></script>
231 
-
232 
-</body>
233 
-
234 
-</html>

+ 111
- 0
pdf_pages/hsd_19372.html 查看文件 

@@ -0,0 +1,111 @@
1 
+<!DOCTYPE html>
2 
+<html>
3 
+
4 
+<head>
5 
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
6 
+    <meta charset="utf-8">
7 
+    <title>KML Click Capture Sample</title>
8 
+    <link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.min.css">
9 
+    <script src="../node_modules/bootstrap/dist/js/bootstrap.min.js" defer></script>
10 
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-abc123..." crossorigin="anonymous" />
11 
+    <link rel="stylesheet" href="../css/app.css">
12 
+
13 
+</head>
14 
+
15 
+<body>
16 
+
17 
+    <section class="section" style="max-height: 100vh;">
18 
+
19 
+        <div class=""
20 
+            style="background-color: #1F3F6D; min-height: 50px; display: flex; align-items: center;padding-left: 100px;">
21 
+            <h6 style="color: white;margin-right: 1em;" class=""><a style="color: white;" href="../details/penternakan_hsd_19372.html"><i
22 
+                        class="fas fa-chevron-left"></i></a></h6>
23 
+            <h6 style="color: white;">Bentong</h6>
24 
+        </div>
25 
+
26 
+        <!-- <div class="text-center pt-5"
27 
+            style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
28 
+            <h5 style="font-weight: 500;">Perbadanan Setiausaha Kejaraan Pahang</h5>
29 
+
30 
+        </div> -->
31 
+
32 
+        <div class="text-center pt-1 pb-5"
33 
+            style="background-color: white;display: flex; justify-content: center; align-items: center;margin-left: -150px;">
34 
+            <div class="pt-5 pb-5" style="width: 600px;height: 100px;">
35 
+                <!-- <img style="border-radius: 20px;" src="image.png" alt=""> -->
36 
+
37 
+                <!-- <div id="capture"></div> -->
38 
+                <div id="pdfViewer"></div>
39 
+
40 
+
41 
+
42 
+            </div>
43 
+        </div>
44 
+
45 
+
46 
+        <script src="../js/jquery-3.7.1.js" defer></script>
47 
+
48 
+        <script src="../js/pdfjs-viewer.js" defer></script>
49 
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.6.347/pdf.min.js"
50 
+            integrity="sha512-Z8CqofpIcnJN80feS2uccz+pXWgZzeKxDsDNMD/dJ6997/LSRY+W4NmEt9acwR+Gt9OHN0kkI1CTianCwoqcjQ=="
51 
+            crossorigin="anonymous" referrerpolicy="no-referrer" defer></script>
52 
+
53 
+    </section>
54 
+
55 
+
56 
+    <!-- <div id="map"></div> -->
57 
+
58 
+    <script>
59 
+        var map;
60 
+        var src = 'https://file.io/t3IwR1hlxwkZ';
61 
+
62 
+        function initMap() {
63 
+            map = new google.maps.Map(document.getElementById('map'), {
64 
+                center: new google.maps.LatLng(-19.257753, 146.823688),
65 
+                zoom: 2,
66 
+                mapTypeId: 'satellite'
67 
+            });
68 
+
69 
+            var kmlLayer = new google.maps.KmlLayer(src, {
70 
+                suppressInfoWindows: true,
71 
+                preserveViewport: false,
72 
+                map: map
73 
+            });
74 
+        }
75 
+
76 
+        document.addEventListener('DOMContentLoaded', () => {
77 
+            // PDF.js script to render PDF
78 
+            const pdfUrl = '../HSD_4638.pdf'; // Replace with your PDF URL
79 
+            const pdfjsLib = window['pdfjs-dist/build/pdf'];
80 
+            pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.6.347/pdf.worker.min.js';
81 
+
82 
+            pdfjsLib.getDocument(pdfUrl).promise.then(function (pdf) {
83 
+                pdf.getPage(1).then(function (page) {
84 
+                    const scale = 1.5;
85 
+                    const viewport = page.getViewport({ scale });
86 
+
87 
+                    const canvas = document.createElement('canvas');
88 
+                    const context = canvas.getContext('2d');
89 
+                    canvas.height = viewport.height;
90 
+                    canvas.width = viewport.width;
91 
+
92 
+                    const renderContext = {
93 
+                        canvasContext: context,
94 
+                        viewport: viewport
95 
+                    };
96 
+
97 
+                    page.render(renderContext);
98 
+                    document.getElementById('pdfViewer').appendChild(canvas);
99 
+                });
100 
+            });
101 
+
102 
+        })
103 
+
104 
+    </script>
105 
+    <script async
106 
+        src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCj5eAmQOg6IhdABVPCBT6ubZ3Yj_IWejI&callback=initMap">
107 
+        </script>
108 
+
109 
+</body>
110 
+
111 
+</html>

+ 0
- 255
pdf_pages/view_pdf.html 查看文件 

@@ -1,255 +0,0 @@
1 
-<!DOCTYPE html>
2 
-<html>
3 
-
4 
-<head>
5 
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
6 
-    <meta charset="utf-8">
7 
-    <title>KML Click Capture Sample</title>
8 
-    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
9 
-    <script src="node_modules/bootstrap/dist/js/bootstrap.min.js" defer></script>
10 
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
11 
-        integrity="sha512-abc123..." crossorigin="anonymous" />
12 
-
13 
-
14 
-
15 
-    <style>
16 
-        html,
17 
-        body {
18 
-            height: 370px;
19 
-            padding: 0;
20 
-            margin: 0;
21 
-        }
22 
-
23 
-        #map {
24 
-            height: 360px;
25 
-            width: 300px;
26 
-            overflow: hidden;
27 
-            float: left;
28 
-            border: thin solid #333;
29 
-        }
30 
-
31 
-        #capture {
32 
-            height: 360px;
33 
-            width: 480px;
34 
-            overflow: hidden;
35 
-            float: left;
36 
-            background-color: #ECECFB;
37 
-            border: thin solid #333;
38 
-            border-left: none;
39 
-        }
40 
-
41 
-        #pdfViewer {
42 
-            width: 100%;
43 
-            height: 600px;
44 
-        }
45 
-    </style>
46 
-
47 
-    <style>
48 
-        /* CSS */
49 
-        .button-23 {
50 
-            background-color: #FFFFFF;
51 
-            border: 1px solid #222222;
52 
-            border-radius: 8px;
53 
-            box-sizing: border-box;
54 
-            color: #222222;
55 
-            cursor: pointer;
56 
-            display: inline-block;
57 
-            font-family: Circular, -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
58 
-            font-size: 16px;
59 
-            font-weight: 600;
60 
-            line-height: 20px;
61 
-            margin: 0;
62 
-            outline: none;
63 
-            padding: 13px 23px;
64 
-            position: relative;
65 
-            text-align: center;
66 
-            text-decoration: none;
67 
-            touch-action: manipulation;
68 
-            transition: box-shadow .2s, -ms-transform .1s, -webkit-transform .1s, transform .1s;
69 
-            user-select: none;
70 
-            -webkit-user-select: none;
71 
-            width: auto;
72 
-        }
73 
-
74 
-        .button-23:focus-visible {
75 
-            box-shadow: #222222 0 0 0 2px, rgba(255, 255, 255, 0.8) 0 0 0 4px;
76 
-            transition: box-shadow .2s;
77 
-        }
78 
-
79 
-        .button-23:active {
80 
-            background-color: #F7F7F7;
81 
-            border-color: #000000;
82 
-            transform: scale(.96);
83 
-        }
84 
-
85 
-        .button-23:disabled {
86 
-            border-color: #DDDDDD;
87 
-            color: #DDDDDD;
88 
-            cursor: not-allowed;
89 
-            opacity: 1;
90 
-        }
91 
-
92 
-        .map-svg {
93 
-            display: block;
94 
-            margin: 0 auto;
95 
-            filter: drop-shadow(-16px 11px 2px rgba(0, 0, 0, 0.5));
96 
-
97 
-            a {
98 
-                transition: all 1s;
99 
-                transform-origin: 50% 50%;
100 
-                text-decoration: none;
101 
-                filter: drop-shadow(3px 10px 5px rgb(0 0 0 / 0.4));
102 
-
103 
-                @media only screen and (min-width: 992px) {
104 
-
105 
-                    polygon,
106 
-                    &:hover {
107 
-                        cursor: pointer;
108 
-                        transform: scale(1.05);
109 
-                        filter: drop-shadow(0px 15px 12px rgb(0 0 0 / 0.7));
110 
-
111 
-                        .st0 {
112 
-                            fill: $dark-default;
113 
-                        }
114 
-                    }
115 
-                }
116 
-            }
117 
-
118 
-            .pahang-barat {
119 
-                fill: #427bba;
120 
-            }
121 
-
122 
-            .pahang-tengah {
123 
-                fill: #144172;
124 
-            }
125 
-
126 
-            .pahang-timur {
127 
-                fill: #0c6088;
128 
-            }
129 
-
130 
-            .label-text {
131 
-                font-size: 35px;
132 
-                fill: white;
133 
-                transform: translate(0,
134 
-                        3px);
135 
-                /* adjust vertical position to centre text */
136 
-            }
137 
-
138 
-            .label-text-cameron {
139 
-                font-size: 20px;
140 
-                fill: white;
141 
-                transform: translate(0,
142 
-                        3px);
143 
-                /* adjust vertical position to centre text */
144 
-            }
145 
-
146 
-
147 
-        }
148 
-    </style>
149 
-
150 
-</head>
151 
-
152 
-<body>
153 
-
154 
-    <section class="section" style="max-height: 100vh;">
155 
-
156 
-        <div class=""
157 
-            style="background-color: #1F3F6D; min-height: 50px; display: flex; align-items: center;padding-left: 100px;">
158 
-            <h6 style="color: white;margin-right: 1em;" class=""><a style="color: white;" href="detail.html"><i
159 
-                        class="fas fa-chevron-left"></i></a></h6>
160 
-            <h6 style="color: white;">Jerantut</h6>
161 
-        </div>
162 
-
163 
-        <!-- <div class="text-center pt-5"
164 
-            style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
165 
-            <h5 style="font-weight: 500;">Perbadanan Setiausaha Kejaraan Pahang</h5>
166 
-
167 
-        </div> -->
168 
-
169 
-        <div class="text-center pt-1 pb-5"
170 
-            style="background-color: white;display: flex; justify-content: center; align-items: center;margin-left: -150px;">
171 
-            <div class="pt-5 pb-5" style="width: 600px;height: 100px;">
172 
-                <!-- <img style="border-radius: 20px;" src="image.png" alt=""> -->
173 
-
174 
-                <!-- <div id="capture"></div> -->
175 
-                <div id="pdfViewer"></div>
176 
-
177 
-
178 
-
179 
-            </div>
180 
-        </div>
181 
-
182 
-
183 
-
184 
-
185 
-
186 
-
187 
-
188 
-
189 
-
190 
-        <script src="js/jquery-3.7.1.js" defer></script>
191 
-
192 
-        <script src="js/pdfjs-viewer.js" defer></script>
193 
-        <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.6.347/pdf.min.js"
194 
-            integrity="sha512-Z8CqofpIcnJN80feS2uccz+pXWgZzeKxDsDNMD/dJ6997/LSRY+W4NmEt9acwR+Gt9OHN0kkI1CTianCwoqcjQ=="
195 
-            crossorigin="anonymous" referrerpolicy="no-referrer" defer></script>
196 
-
197 
-    </section>
198 
-
199 
-
200 
-    <!-- <div id="map"></div> -->
201 
-
202 
-    <script>
203 
-        var map;
204 
-        var src = 'https://file.io/t3IwR1hlxwkZ';
205 
-
206 
-        function initMap() {
207 
-            map = new google.maps.Map(document.getElementById('map'), {
208 
-                center: new google.maps.LatLng(-19.257753, 146.823688),
209 
-                zoom: 2,
210 
-                mapTypeId: 'satellite'
211 
-            });
212 
-
213 
-            var kmlLayer = new google.maps.KmlLayer(src, {
214 
-                suppressInfoWindows: true,
215 
-                preserveViewport: false,
216 
-                map: map
217 
-            });
218 
-        }
219 
-
220 
-        document.addEventListener('DOMContentLoaded', () => {
221 
-            // PDF.js script to render PDF
222 
-            const pdfUrl = './HSD 11991.pdf'; // Replace with your PDF URL
223 
-            const pdfjsLib = window['pdfjs-dist/build/pdf'];
224 
-            pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.6.347/pdf.worker.min.js';
225 
-
226 
-            pdfjsLib.getDocument(pdfUrl).promise.then(function (pdf) {
227 
-                pdf.getPage(1).then(function (page) {
228 
-                    const scale = 1.5;
229 
-                    const viewport = page.getViewport({ scale });
230 
-
231 
-                    const canvas = document.createElement('canvas');
232 
-                    const context = canvas.getContext('2d');
233 
-                    canvas.height = viewport.height;
234 
-                    canvas.width = viewport.width;
235 
-
236 
-                    const renderContext = {
237 
-                        canvasContext: context,
238 
-                        viewport: viewport
239 
-                    };
240 
-
241 
-                    page.render(renderContext);
242 
-                    document.getElementById('pdfViewer').appendChild(canvas);
243 
-                });
244 
-            });
245 
-
246 
-        })
247 
-
248 
-    </script>
249 
-    <script async
250 
-        src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCj5eAmQOg6IhdABVPCBT6ubZ3Yj_IWejI&callback=initMap">
251 
-        </script>
252 
-
253 
-</body>
254 
-
255 
-</html>

Write Preview
Loading…
取消
儲存