diff --git a/i18n/venue/index.i18n.js b/i18n/venue/index.i18n.js
index 6ef1373cc6..57b7205555 100644
--- a/i18n/venue/index.i18n.js
+++ b/i18n/venue/index.i18n.js
@@ -12,6 +12,9 @@ export default genI18nMessages({
             address:
                 'No. 128, Sec. 2, Academia Rd., Nankang, Taipei 115, Taiwan',
         },
+        venueMap: {
+            title: 'Venue Map',
+        },
         transMode: {
             car: 'By Car',
             publicTransport: 'By Public Transport',
@@ -143,6 +146,9 @@ export default genI18nMessages({
             name: '中央研究院\n人文社會科學館',
             address: '台北市南港區研究院路 2 段 128 號',
         },
+        venueMap: {
+            title: '會場地圖',
+        },
         transMode: {
             car: '自行開車',
             publicTransport: '大眾運輸工具',
diff --git a/layouts/default.vue b/layouts/default.vue
index f60c9f528f..1cadec27f7 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -153,7 +153,8 @@ html {
 
 .default-layout__header {
     @apply fixed w-full;
-    z-index: 1000;
+    /* over leaflet z-index 1000 */
+    z-index: 1001;
     height: 52px;
 }
 
diff --git a/nuxt.config.js b/nuxt.config.js
index cd75afce9f..12f13734e6 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -61,11 +61,12 @@ export default {
 
     // Plugins to run before rendering page (https://go.nuxtjs.dev/config-plugins)
     plugins: [
-        '~/plugins/iterator.js',
-        '~/plugins/http.js',
-        '~/plugins/strings.js',
-        '~/plugins/vue-dompurify.js',
-        '~/plugins/vue-awesome-swiper.js',
+        { src: '~/plugins/iterator.js' },
+        { src: '~/plugins/http.js' },
+        { src: '~/plugins/strings.js' },
+        { src: '~/plugins/vue-dompurify.js' },
+        { src: '~/plugins/vue-awesome-swiper.js' },
+        { src: '~/plugins/leaflet.js', mode: 'client' },
     ],
 
     // Auto import components (https://go.nuxtjs.dev/config-components)
@@ -97,7 +98,7 @@ export default {
         // https://github.com/WilliamDASILVA/nuxt-facebook-pixel-module
         'nuxt-facebook-pixel-module',
         // https://i18n.nuxtjs.org/
-        'nuxt-i18n',
+        '@nuxtjs/i18n',
         [
             'nuxt-fontawesome',
             {
@@ -124,7 +125,6 @@ export default {
         // This module must be at the end of the modules array
         '@nuxtjs/sitemap',
     ],
-
     i18n: {
         strategy: 'prefix',
         locale: 'en-us',
@@ -132,7 +132,7 @@ export default {
         fallbackLocale: 'en-us',
         locales: ['en-us', 'zh-hant'],
         detectBrowserLanguage: {
-            onlyOnRoot: true, // recommended
+            redirectOn: 'root',
         },
     },
 
diff --git a/package-lock.json b/package-lock.json
index 3cab27c284..7aac45be69 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -133,6 +133,11 @@
                 "semver": "^6.1.2"
             }
         },
+        "@babel/helper-environment-visitor": {
+            "version": "7.22.5",
+            "resolved": "https://registry.npmjs.org/@babel/helper-environment-visitor/-/helper-environment-visitor-7.22.5.tgz",
+            "integrity": "sha512-XGmhECfVA/5sAt+H+xpSg0mfrHq6FzNr9Oxh7PSEBBRUb/mL7Kz3NICXb194rCqAEdxkhPT1a88teizAFyvk8Q=="
+        },
         "@babel/helper-explode-assignable-expression": {
             "version": "7.14.5",
             "resolved": "https://registry.npmjs.org/@babel/helper-explode-assignable-expression/-/helper-explode-assignable-expression-7.14.5.tgz",
@@ -256,6 +261,11 @@
                 "@babel/types": "^7.14.5"
             }
         },
+        "@babel/helper-string-parser": {
+            "version": "7.22.5",
+            "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.22.5.tgz",
+            "integrity": "sha512-mM4COjgZox8U+JcXQwPijIZLElkgEpO5rsERVDJTc2qfCDfERyob6k5WegS14SX18IIjv+XD+GrqNumY5JRCDw=="
+        },
         "@babel/helper-validator-identifier": {
             "version": "7.14.9",
             "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.14.9.tgz",
@@ -1154,9 +1164,9 @@
             "dev": true
         },
         "@intlify/shared": {
-            "version": "9.1.7",
-            "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.1.7.tgz",
-            "integrity": "sha512-zt0zlUdalumvT9AjQNxPXA36UgOndUyvBMplh8uRZU0fhWHAwhnJTcf0NaG9Qvr8I1n3HPSs96+kLb/YdwTavQ=="
+            "version": "9.2.2",
+            "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.2.2.tgz",
+            "integrity": "sha512-wRwTpsslgZS5HNyM7uDQYZtxnbI12aGiBZURX3BTR9RFIKKRWpllTsgzHWvj3HKm3Y2Sh5LPC1r0PDCKEhVn9Q=="
         },
         "@intlify/vue-i18n-extensions": {
             "version": "1.0.2",
@@ -1662,6 +1672,47 @@
                 }
             }
         },
+        "@jridgewell/gen-mapping": {
+            "version": "0.3.3",
+            "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz",
+            "integrity": "sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ==",
+            "requires": {
+                "@jridgewell/set-array": "^1.0.1",
+                "@jridgewell/sourcemap-codec": "^1.4.10",
+                "@jridgewell/trace-mapping": "^0.3.9"
+            }
+        },
+        "@jridgewell/resolve-uri": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.0.tgz",
+            "integrity": "sha512-F2msla3tad+Mfht5cJq7LSXcdudKTWCVYUgw6pLFOOHSTtZlj6SWNYAp+AhuqLmWdBO2X5hPrLcu8cVP8fy28w=="
+        },
+        "@jridgewell/set-array": {
+            "version": "1.1.2",
+            "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.1.2.tgz",
+            "integrity": "sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw=="
+        },
+        "@jridgewell/sourcemap-codec": {
+            "version": "1.4.15",
+            "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz",
+            "integrity": "sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg=="
+        },
+        "@jridgewell/trace-mapping": {
+            "version": "0.3.18",
+            "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.18.tgz",
+            "integrity": "sha512-w+niJYzMHdd7USdiH2U6869nqhD2nbfZXND5Yp93qIbEmnDNk7PD48o+YchRVpzMU7M6jVCbenTR7PA1FLQ9pA==",
+            "requires": {
+                "@jridgewell/resolve-uri": "3.1.0",
+                "@jridgewell/sourcemap-codec": "1.4.14"
+            },
+            "dependencies": {
+                "@jridgewell/sourcemap-codec": {
+                    "version": "1.4.14",
+                    "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz",
+                    "integrity": "sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw=="
+                }
+            }
+        },
         "@koa/router": {
             "version": "9.4.0",
             "resolved": "https://registry.npmjs.org/@koa/router/-/router-9.4.0.tgz",
@@ -3124,6 +3175,144 @@
                 }
             }
         },
+        "@nuxtjs/i18n": {
+            "version": "7.3.1",
+            "resolved": "https://registry.npmjs.org/@nuxtjs/i18n/-/i18n-7.3.1.tgz",
+            "integrity": "sha512-DZP6xR8zZA1ApcNjLnukH3BhMRCfi3r236epuXVuPWWOObPf5vkp+VamewnPiSU+zs0Age+PbaaIUryFv/6pDA==",
+            "requires": {
+                "@babel/parser": "^7.18.10",
+                "@babel/traverse": "^7.18.10",
+                "@intlify/vue-i18n-extensions": "^1.0.2",
+                "@intlify/vue-i18n-loader": "^1.1.0",
+                "@nuxt/utils": "2.x",
+                "cookie": "^0.5.0",
+                "devalue": "^2.0.1",
+                "is-https": "^4.0.0",
+                "js-cookie": "^3.0.1",
+                "klona": "^2.0.5",
+                "lodash.merge": "^4.6.2",
+                "ufo": "^0.8.5",
+                "vue-i18n": "^8.27.2"
+            },
+            "dependencies": {
+                "@babel/code-frame": {
+                    "version": "7.22.5",
+                    "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.22.5.tgz",
+                    "integrity": "sha512-Xmwn266vad+6DAqEB2A6V/CcZVp62BbwVmcOJc2RPuwih1kw02TjQvWVWlcKGbBPd+8/0V5DEkOcizRGYsspYQ==",
+                    "requires": {
+                        "@babel/highlight": "^7.22.5"
+                    }
+                },
+                "@babel/generator": {
+                    "version": "7.22.9",
+                    "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.22.9.tgz",
+                    "integrity": "sha512-KtLMbmicyuK2Ak/FTCJVbDnkN1SlT8/kceFTiuDiiRUUSMnHMidxSCdG4ndkTOHHpoomWe/4xkvHkEOncwjYIw==",
+                    "requires": {
+                        "@babel/types": "^7.22.5",
+                        "@jridgewell/gen-mapping": "^0.3.2",
+                        "@jridgewell/trace-mapping": "^0.3.17",
+                        "jsesc": "^2.5.1"
+                    }
+                },
+                "@babel/helper-function-name": {
+                    "version": "7.22.5",
+                    "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.22.5.tgz",
+                    "integrity": "sha512-wtHSq6jMRE3uF2otvfuD3DIvVhOsSNshQl0Qrd7qC9oQJzHvOL4qQXlQn2916+CXGywIjpGuIkoyZRRxHPiNQQ==",
+                    "requires": {
+                        "@babel/template": "^7.22.5",
+                        "@babel/types": "^7.22.5"
+                    }
+                },
+                "@babel/helper-hoist-variables": {
+                    "version": "7.22.5",
+                    "resolved": "https://registry.npmjs.org/@babel/helper-hoist-variables/-/helper-hoist-variables-7.22.5.tgz",
+                    "integrity": "sha512-wGjk9QZVzvknA6yKIUURb8zY3grXCcOZt+/7Wcy8O2uctxhplmUPkOdlgoNhmdVee2c92JXbf1xpMtVNbfoxRw==",
+                    "requires": {
+                        "@babel/types": "^7.22.5"
+                    }
+                },
+                "@babel/helper-split-export-declaration": {
+                    "version": "7.22.6",
+                    "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.22.6.tgz",
+                    "integrity": "sha512-AsUnxuLhRYsisFiaJwvp1QF+I3KjD5FOxut14q/GzovUe6orHLesW2C7d754kRm53h5gqrz6sFl6sxc4BVtE/g==",
+                    "requires": {
+                        "@babel/types": "^7.22.5"
+                    }
+                },
+                "@babel/helper-validator-identifier": {
+                    "version": "7.22.5",
+                    "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.5.tgz",
+                    "integrity": "sha512-aJXu+6lErq8ltp+JhkJUfk1MTGyuA4v7f3pA+BJ5HLfNC6nAQ0Cpi9uOquUj8Hehg0aUiHzWQbOVJGao6ztBAQ=="
+                },
+                "@babel/highlight": {
+                    "version": "7.22.5",
+                    "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.22.5.tgz",
+                    "integrity": "sha512-BSKlD1hgnedS5XRnGOljZawtag7H1yPfQp0tdNJCHoH6AZ+Pcm9VvkrK59/Yy593Ypg0zMxH2BxD1VPYUQ7UIw==",
+                    "requires": {
+                        "@babel/helper-validator-identifier": "^7.22.5",
+                        "chalk": "^2.0.0",
+                        "js-tokens": "^4.0.0"
+                    }
+                },
+                "@babel/parser": {
+                    "version": "7.22.7",
+                    "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.22.7.tgz",
+                    "integrity": "sha512-7NF8pOkHP5o2vpmGgNGcfAeCvOYhGLyA3Z4eBQkT1RJlWu47n63bCs93QfJ2hIAFCil7L5P2IWhs1oToVgrL0Q=="
+                },
+                "@babel/template": {
+                    "version": "7.22.5",
+                    "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.22.5.tgz",
+                    "integrity": "sha512-X7yV7eiwAxdj9k94NEylvbVHLiVG1nvzCV2EAowhxLTwODV1jl9UzZ48leOC0sH7OnuHrIkllaBgneUykIcZaw==",
+                    "requires": {
+                        "@babel/code-frame": "^7.22.5",
+                        "@babel/parser": "^7.22.5",
+                        "@babel/types": "^7.22.5"
+                    }
+                },
+                "@babel/traverse": {
+                    "version": "7.22.8",
+                    "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.22.8.tgz",
+                    "integrity": "sha512-y6LPR+wpM2I3qJrsheCTwhIinzkETbplIgPBbwvqPKc+uljeA5gP+3nP8irdYt1mjQaDnlIcG+dw8OjAco4GXw==",
+                    "requires": {
+                        "@babel/code-frame": "^7.22.5",
+                        "@babel/generator": "^7.22.7",
+                        "@babel/helper-environment-visitor": "^7.22.5",
+                        "@babel/helper-function-name": "^7.22.5",
+                        "@babel/helper-hoist-variables": "^7.22.5",
+                        "@babel/helper-split-export-declaration": "^7.22.6",
+                        "@babel/parser": "^7.22.7",
+                        "@babel/types": "^7.22.5",
+                        "debug": "^4.1.0",
+                        "globals": "^11.1.0"
+                    }
+                },
+                "@babel/types": {
+                    "version": "7.22.5",
+                    "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.22.5.tgz",
+                    "integrity": "sha512-zo3MIHGOkPOfoRXitsgHLjEXmlDaD/5KU1Uzuc9GNiZPhSqVxVRtxuPaSBZDsYZ9qV88AjtMtWW7ww98loJ9KA==",
+                    "requires": {
+                        "@babel/helper-string-parser": "^7.22.5",
+                        "@babel/helper-validator-identifier": "^7.22.5",
+                        "to-fast-properties": "^2.0.0"
+                    }
+                },
+                "cookie": {
+                    "version": "0.5.0",
+                    "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.5.0.tgz",
+                    "integrity": "sha512-YZ3GUyn/o8gfKJlnlX7g7xq4gyO6OSuhGPKaaGssGB2qgDUS0gPgtTvoyZLTt9Ab6dC4hfc9dV5arkvc/OCmrw=="
+                },
+                "klona": {
+                    "version": "2.0.6",
+                    "resolved": "https://registry.npmjs.org/klona/-/klona-2.0.6.tgz",
+                    "integrity": "sha512-dhG34DXATL5hSxJbIexCft8FChFXtmskoZYnoPWjXQuebWYCNkVeV3KkGegCK9CP1oswI/vQibS2GY7Em/sJJA=="
+                },
+                "ufo": {
+                    "version": "0.8.6",
+                    "resolved": "https://registry.npmjs.org/ufo/-/ufo-0.8.6.tgz",
+                    "integrity": "sha512-fk6CmUgwKCfX79EzcDQQpSCMxrHstvbLswFChHS0Vump+kFkw7nJBfTZoC1j0bOGoY9I7R3n2DGek5ajbcYnOw=="
+                }
+            }
+        },
         "@nuxtjs/markdownit": {
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/@nuxtjs/markdownit/-/markdownit-2.0.0.tgz",
@@ -11443,9 +11632,9 @@
             }
         },
         "js-cookie": {
-            "version": "3.0.0",
-            "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-3.0.0.tgz",
-            "integrity": "sha512-oUbbplKuH07/XX2YD2+Q+GMiPpnVXaRz8npE7suhBH9QEkJe2W7mQ6rwuMXHue3fpfcftQwzgyvGzIHyfCSngQ=="
+            "version": "3.0.5",
+            "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-3.0.5.tgz",
+            "integrity": "sha512-cEiJEAEoIbWfCZYKWhVwFuvPX1gETRYPw6LlaTKoxD3s2AkXzkCjnp6h0V77ozyqj0jakteJ4YqDJT830+lVGw=="
         },
         "js-tokens": {
             "version": "4.0.0",
@@ -11737,7 +11926,8 @@
         "klona": {
             "version": "2.0.4",
             "resolved": "https://registry.npmjs.org/klona/-/klona-2.0.4.tgz",
-            "integrity": "sha512-ZRbnvdg/NxqzC7L9Uyqzf4psi1OM4Cuc+sJAkQPjO6XkQIJTNbfK2Rsmbw8fx1p2mkZdp2FZYo2+LwXYY/uwIA=="
+            "integrity": "sha512-ZRbnvdg/NxqzC7L9Uyqzf4psi1OM4Cuc+sJAkQPjO6XkQIJTNbfK2Rsmbw8fx1p2mkZdp2FZYo2+LwXYY/uwIA==",
+            "dev": true
         },
         "koa": {
             "version": "2.13.1",
@@ -11913,6 +12103,11 @@
                 "launch-editor": "^2.2.1"
             }
         },
+        "leaflet": {
+            "version": "1.9.4",
+            "resolved": "https://registry.npmjs.org/leaflet/-/leaflet-1.9.4.tgz",
+            "integrity": "sha512-nxS1ynzJOmOlHp+iL3FyWqK89GtNL8U8rvlMOsQdTTssxZwCXh8N2NB3GDQOL+YR3XnWyZAxwQixURb+FA74PA=="
+        },
         "leven": {
             "version": "3.1.0",
             "resolved": "https://registry.npmjs.org/leven/-/leven-3.1.0.tgz",
@@ -12966,32 +13161,6 @@
                 "@fortawesome/vue-fontawesome": "^0.1.4"
             }
         },
-        "nuxt-i18n": {
-            "version": "6.28.1",
-            "resolved": "https://registry.npmjs.org/nuxt-i18n/-/nuxt-i18n-6.28.1.tgz",
-            "integrity": "sha512-JKRs8AmixVZ7k90Rrwq468McfnInP1ymuejYHRGA4VV0nZCLYsdDQXZxXl3JXaER9VatM9C24GM3ArAYFOtUhg==",
-            "requires": {
-                "@babel/parser": "^7.14.9",
-                "@babel/traverse": "^7.14.9",
-                "@intlify/vue-i18n-extensions": "^1.0.2",
-                "@intlify/vue-i18n-loader": "^1.1.0",
-                "cookie": "^0.4.1",
-                "devalue": "^2.0.1",
-                "is-https": "^4.0.0",
-                "js-cookie": "^3.0.0",
-                "klona": "^2.0.4",
-                "lodash.merge": "^4.6.2",
-                "ufo": "^0.7.7",
-                "vue-i18n": "^8.25.0"
-            },
-            "dependencies": {
-                "cookie": {
-                    "version": "0.4.1",
-                    "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.1.tgz",
-                    "integrity": "sha512-ZwrFkGJxUR3EIoXtO+yVE69Eb7KlixbaeAWfBQB9vVsNn/o+Yw69gBWSSDK825hQNdN+wF8zELf3dFNl/kxkUA=="
-                }
-            }
-        },
         "nwsapi": {
             "version": "2.2.0",
             "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.0.tgz",
@@ -19534,9 +19703,9 @@
             "integrity": "sha512-BXq3jwIagosjgNVae6tkHzzIk6a8MHFtzAdwhnV5VlvPTFxDCvIttgSiHWjdGoTJvXtmRu5HacExfdarRcFhog=="
         },
         "vue-i18n": {
-            "version": "8.25.0",
-            "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.25.0.tgz",
-            "integrity": "sha512-ynhcL+PmTxuuSE1T10htiSXzjBozxYIE3ffbM1RfgAkVbr/v1SP+9Mi/7/uv8ZVV1yGuKjFAYp9BXq+X7op6MQ=="
+            "version": "8.28.2",
+            "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.28.2.tgz",
+            "integrity": "sha512-C5GZjs1tYlAqjwymaaCPDjCyGo10ajUphiwA922jKt9n7KPpqR7oM1PCwYzhB/E7+nT3wfdG3oRre5raIT1rKA=="
         },
         "vue-jest": {
             "version": "3.0.7",
@@ -19730,6 +19899,11 @@
             "resolved": "https://registry.npmjs.org/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz",
             "integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw=="
         },
+        "vue2-leaflet": {
+            "version": "2.7.1",
+            "resolved": "https://registry.npmjs.org/vue2-leaflet/-/vue2-leaflet-2.7.1.tgz",
+            "integrity": "sha512-K7HOlzRhjt3Z7+IvTqEavIBRbmCwSZSCVUlz9u4Rc+3xGCLsHKz4TAL4diAmfHElCQdPPVdZdJk8wPUt2fu6WQ=="
+        },
         "vuex": {
             "version": "3.6.2",
             "resolved": "https://registry.npmjs.org/vuex/-/vuex-3.6.2.tgz",
diff --git a/package.json b/package.json
index e4b7b70430..9fa321231c 100644
--- a/package.json
+++ b/package.json
@@ -19,19 +19,21 @@
         "@fortawesome/free-regular-svg-icons": "^5.15.4",
         "@fortawesome/free-solid-svg-icons": "^5.15.3",
         "@nuxt/http": "^0.6.2",
+        "@nuxtjs/i18n": "^7.3.1",
         "@nuxtjs/markdownit": "^2.0.0",
         "@nuxtjs/sitemap": "^2.4.0",
         "@tailwindcss/aspect-ratio": "^0.2.1",
         "core-js": "^3.6.5",
         "dayjs": "^1.10.6",
+        "leaflet": "^1.9.4",
         "nuxt": "^2.15.3",
         "nuxt-facebook-pixel-module": "^1.5.0",
         "nuxt-fontawesome": "^0.4.0",
-        "nuxt-i18n": "^6.18.0",
         "swiper": "^6.7.5",
         "uuid": "^8.3.2",
         "vue-awesome-swiper": "^4.1.1",
-        "vue-dompurify-html": "^2.3.0"
+        "vue-dompurify-html": "^2.3.0",
+        "vue2-leaflet": "^2.7.1"
     },
     "devDependencies": {
         "@nuxt/types": "^2.14.11",
diff --git a/pages/venue/index.vue b/pages/venue/index.vue
index 23f52a1e16..664aa7a1fc 100644
--- a/pages/venue/index.vue
+++ b/pages/venue/index.vue
@@ -30,6 +30,15 @@
                 v-if="selectedTransModeIndex === 2"
             ></VenueShuttleServiceTab>
         </div>
+        <client-only v-if="selectedTransModeIndex === 1">
+            <core-h1
+                class="venue-title whitespace-pre-line pt-20 text-center"
+                :title="$t('venueMap.title')"
+                center
+            >
+            </core-h1>
+            <VenueMap class=""></VenueMap>
+        </client-only>
     </i18n-page-wrapper>
 </template>
 
@@ -42,7 +51,6 @@ import VenueTab from '@/components/venue/VenueTab.vue'
 import VenuePublicTransporterTab from '@/components/venue/VenuePublicTransporterTab.vue'
 import VenueDriveTab from '@/components/venue/VenueDriveTab.vue'
 import VenueShuttleServiceTab from '@/components/venue/VenueShuttleServiceTab.vue'
-
 export default {
     i18n,
     name: 'PageVenue',
@@ -54,6 +62,7 @@ export default {
         VenuePublicTransporterTab,
         VenueDriveTab,
         VenueShuttleServiceTab,
+        VenueMap: () => import('./venueMap.vue'),
     },
     data() {
         return {
diff --git a/pages/venue/venueMap.vue b/pages/venue/venueMap.vue
new file mode 100644
index 0000000000..e60175baae
--- /dev/null
+++ b/pages/venue/venueMap.vue
@@ -0,0 +1,122 @@
+<template>
+    <l-map
+        ref="leafletMap"
+        style="height: 300px"
+        :zoom="zoom"
+        :center="center"
+        :options="options"
+    >
+        <l-tile-layer
+            v-for="tileProvider in tileProviders"
+            :key="tileProvider.name"
+            :name="tileProvider.name"
+            :visible="tileProvider.visible"
+            :url="tileProvider.url"
+            :attribution="tileProvider.attribution"
+            layer-type="base"
+        />
+
+        <l-control-layers position="bottomright"></l-control-layers>
+        <l-control-zoom position="topright"></l-control-zoom>
+        <l-control
+            position="topright"
+            class="leaflet-bar custom-control rounded-sm"
+        >
+            <button
+                class="h-[30px] w-[30px] bg-white leading-[30px]"
+                @click="centerMap"
+            >
+                <img
+                    class="m-auto"
+                    :src="venueButtonUrl"
+                    alt="venue-center-btn"
+                />
+            </button>
+        </l-control>
+        <l-marker :lat-lng="markerLatLng" :icon="icon">
+            <l-tooltip
+                :options="{
+                    offset: [-4, 20],
+                    direction: 'bottom',
+                }"
+                >中央研究院 人文社會科學館</l-tooltip
+            ></l-marker
+        >
+    </l-map>
+</template>
+
+<script>
+import {
+    LMap,
+    LControl,
+    LTileLayer,
+    LMarker,
+    LControlZoom,
+    LControlLayers,
+    LTooltip,
+} from 'vue2-leaflet'
+import { icon } from 'leaflet'
+export default {
+    name: 'VenueMap',
+    components: {
+        LMap,
+        LTileLayer,
+        LMarker,
+        LControlZoom,
+        LControlLayers,
+        LTooltip,
+        LControl,
+    },
+    data() {
+        return {
+            venueButtonUrl: require('@/static/venue-button.png'),
+            currentCenter: [25.040997, 121.611417],
+            options: {
+                zoomControl: false,
+                scrollWheelZoom: false,
+                minZoom: 10,
+            },
+            tileProviders: [
+                {
+                    name: 'Stamen',
+                    visible: false,
+                    attribution:
+                        'Tiles by <a href="https://stamen.com">Stamen Design</a>. Data &copy; <a href="https://openstreetmap.org">OpenStreetMap</a> contributors.',
+                    url: 'http://{s}.sm.mapstack.stamen.com/((toner-background,$fff[@20],$000[hsl-color])[@90],(toner-lines,$fff[@80],$fff[hsl-saturation@20],$502526[hsl-color]),(toner-labels,$fff[@30]))/{z}/{x}/{y}.png',
+                },
+                {
+                    name: 'Transport',
+                    visible: true,
+
+                    attribution:
+                        'Maps &copy; <a href="https://www.thunderforest.com" target="_blank" rel="noopener">Thunderforest</a>, Data &copy; <a href="https://www.openstreetmap.org/copyright" target="_blank" rel="noopener">OpenStreetMap </a> contributors.',
+                    url: 'https://{s}.tile.thunderforest.com/transport/{z}/{x}/{y}.png?apikey=6170aad10dfd42a38d4d8c709a536f38',
+                },
+            ],
+            url: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
+            attribution:
+                '&copy; <a target="_blank" href="http://osm.org/copyright">OpenStreetMap</a> contributors',
+            zoom: 16,
+            icon: icon({
+                iconUrl: '/snake.png',
+                shadowUrl: '/snake-bg.png',
+                iconSize: [42, 42],
+                iconAnchor: [21, 21],
+                shadowSize: [45, 55],
+                shadowAnchor: [25, 30],
+            }),
+            center: [25.040997, 121.611417],
+            markerLatLng: [25.040997, 121.611417],
+        }
+    },
+    methods: {
+        centerMap() {
+            this.$nextTick(() => {
+                this.$refs.leafletMap.mapObject.panTo([25.040997, 121.611417])
+            })
+        },
+    },
+}
+</script>
+
+<style scoped></style>
diff --git a/plugins/leaflet.js b/plugins/leaflet.js
new file mode 100644
index 0000000000..f5438c8424
--- /dev/null
+++ b/plugins/leaflet.js
@@ -0,0 +1,7 @@
+import Vue from 'vue'
+import { LMap, LTileLayer, LMarker } from 'vue2-leaflet'
+import 'leaflet/dist/leaflet.css'
+
+Vue.component('l-map', LMap)
+Vue.component('l-tile-layer', LTileLayer)
+Vue.component('l-marker', LMarker)
diff --git a/static/snake-bg.png b/static/snake-bg.png
new file mode 100644
index 0000000000..b31db4684c
Binary files /dev/null and b/static/snake-bg.png differ
diff --git a/static/snake.png b/static/snake.png
new file mode 100644
index 0000000000..dd94333df4
Binary files /dev/null and b/static/snake.png differ
diff --git a/static/venue-button.png b/static/venue-button.png
new file mode 100644
index 0000000000..9a45fcd955
Binary files /dev/null and b/static/venue-button.png differ