联系我们增加了地图

application/views/layouts/home_contact_layout.php

@@ -62,8 +62,39 @@
                 <p>
                     <img src="<?= asset_url('assets/img/whatsapp-qr-code.png') ?>" alt="WhatsApp QR Code" style="width: 150px;">
                 </p>
+                <div id="map-container" style="width: 100%; height: 400px;"></div>
+                <p>
+                    <button id="navigate-button" class="btn btn-primary">导航至此处</button>
+                </p>
             </div>
 
+            <script src="https://webapi.amap.com/maps?v=2.0&key=d602bdb819284cf772bb6f9498acac75"></script>
+            <script>
+                var map = new AMap.Map('map-container', {
+                    resizeEnable: true,
+                    center: [114.124435,22.369331], // 设置中心点坐标为荃湾地区
+                    zoom: 18 // 地图缩放级别
+                });
+
+                var marker = new AMap.Marker({
+                    position: [114.124435,22.369331] // 标记位置为荃灣荃豐中心
+                });
+
+                map.add(marker);
+
+                document.getElementById('navigate-button').onclick = function() {
+                    var destination = "114.124435,22.369331"; // 荃灣荃豐中心的坐标
+                    var amapUrl = "https://uri.amap.com/navigation?to=" + destination + "&mode=car&src=webapp";
+
+                    // 在移动设备上调用地图应用
+                    if (/Android|iPhone/i.test(navigator.userAgent)) {
+                        window.location.href = amapUrl;
+                    } else {
+                        window.open(amapUrl, '_blank');
+                    }
+                };
+            </script>
+
             <?php component('booking_footer', ['display_login_button' => vars('display_login_button')]); ?>
         </div>
     </div>