{"id":2334,"date":"2026-01-19T08:52:30","date_gmt":"2026-01-19T08:52:30","guid":{"rendered":"https:\/\/www.arts.chula.ac.th\/geography\/?page_id=2334"},"modified":"2026-01-19T11:20:35","modified_gmt":"2026-01-19T11:20:35","slug":"project-%e0%b8%84%e0%b8%a5%e0%b8%b1%e0%b8%87%e0%b9%81%e0%b8%9c%e0%b8%99%e0%b8%97%e0%b8%b5%e0%b9%88%e0%b8%84%e0%b8%b3%e0%b8%a8%e0%b8%b1%e0%b8%9e%e0%b8%97%e0%b9%8c%e0%b8%a0%e0%b8%b2%e0%b8%a9%e0%b8%b2-18","status":"publish","type":"page","link":"https:\/\/www.arts.chula.ac.th\/geography\/?page_id=2334","title":{"rendered":"Project \u0e04\u0e25\u0e31\u0e07\u0e41\u0e1c\u0e19\u0e17\u0e35\u0e48\u0e04\u0e33\u0e28\u0e31\u0e1e\u0e17\u0e4c\u0e20\u0e32\u0e29\u0e32\u0e16\u0e34\u0e48\u0e19 \u0e1b\u0e23\u0e30\u0e40\u0e17\u0e28\u0e44\u0e17\u0e22 (\u0e1e.\u0e28. 2545)"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"2334\" class=\"elementor elementor-2334\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b0e36b0 e-flex e-con-boxed e-con e-parent\" data-id=\"b0e36b0\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-287984c elementor-widget elementor-widget-html\" data-id=\"287984c\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"back-button-container\" style=\"margin: 20px 0; text-align: left;\">\n    <a href=\"history.back()\" class=\"btn-back\">\n        <span class=\"icon\">\u2190<\/span> \u0e22\u0e49\u0e2d\u0e19\u0e01\u0e25\u0e31\u0e1a\n    <\/a>\n<\/div>\n\n<style>\n    .btn-back {\n        display: inline-flex;\n        align-items: center;\n        padding: 10px 20px;\n        background-color: #f4f4f4; \/* \u0e2a\u0e35\u0e1e\u0e37\u0e49\u0e19\u0e2b\u0e25\u0e31\u0e07\u0e1b\u0e38\u0e48\u0e21 *\/\n        color: #333 !important; \/* \u0e2a\u0e35\u0e15\u0e31\u0e27\u0e2d\u0e31\u0e01\u0e29\u0e23 *\/\n        text-decoration: none !important;\n        border-radius: 50px; \/* \u0e17\u0e33\u0e1b\u0e38\u0e48\u0e21\u0e21\u0e19 *\/\n        font-weight: bold;\n        font-size: 16px;\n        transition: all 0.3s ease;\n        border: 1px solid #ddd;\n        box-shadow: 0 2px 5px rgba(0,0,0,0.05);\n    }\n\n    .btn-back .icon {\n        margin-right: 8px;\n        font-size: 20px;\n    }\n\n    .btn-back:hover {\n        background-color: #333; \/* \u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e2a\u0e35\u0e40\u0e21\u0e37\u0e48\u0e2d Hover *\/\n        color: #fff !important;\n        transform: translateX(-5px); \/* \u0e40\u0e25\u0e37\u0e48\u0e2d\u0e19\u0e0b\u0e49\u0e32\u0e22\u0e40\u0e25\u0e47\u0e01\u0e19\u0e49\u0e2d\u0e22\u0e15\u0e2d\u0e19 Hover *\/\n        box-shadow: 0 4px 10px rgba(0,0,0,0.15);\n    }\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-880849f elementor-widget elementor-widget-html\" data-id=\"880849f\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div style=\"text-align: center; margin-bottom: 20px;\">\n    <h1 id=\"dynamic-h1\" style=\"font-size: 36px; color: #333; margin-bottom: 10px;\">\n        \u0e01\u0e33\u0e25\u0e31\u0e07\u0e42\u0e2b\u0e25\u0e14\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25...\n    <\/h1>\n<\/div>\n\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", function() {\n    const params = new URLSearchParams(window.location.search);\n    const n = params.get('n');\n    const h1Element = document.getElementById('dynamic-h1');\n    const nDisplay = document.getElementById('dynamic-n-display');\n\n    \/\/ 1. \u0e15\u0e32\u0e23\u0e32\u0e07\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25 Condition\n    const titles = {\n        \"1\": \"\u0e08\u0e21\u0e39\u0e01\", \"2\": \"\u0e1b\u0e32\u0e01\", \"3\": \"\u0e1f\u0e31\u0e19\", \"4\": \"\u0e17\u0e49\u0e32\u0e22\u0e17\u0e2d\u0e22\", \"5\": \"\u0e15\u0e31\u0e27\",\n        \"6\": \"\u0e2a\u0e30\u0e14\u0e37\u0e2d\", \"7\": \"\u0e19\u0e48\u0e2d\u0e07\", \"8\": \"\u0e15\u0e32\u0e15\u0e38\u0e48\u0e21\", \"9\": \"\u0e2b\u0e39\u0e14\", \"10\": \"\u0e40\u0e2a\u0e25\u0e14\",\n        \"11\": \"\u0e02\u0e35\u0e49\u0e44\u0e04\u0e25\", \"12\": \"\u0e2b\u0e37\u0e14\", \"13\": \"\u0e25\u0e21\u0e1e\u0e34\u0e29\", \"14\": \"\u0e41\u0e1c\u0e25\", \"15\": \"\u0e40\u0e2b\u0e25\u0e47\u0e01\u0e43\u0e19\",\n        \"16\": \"\u0e04\u0e23\u0e35\u0e1a\", \"17\": \"\u0e21\u0e30\u0e25\u0e30\u0e01\u0e2d\", \"18\": \"\u0e2a\u0e31\u0e1a\u0e1b\u0e30\u0e23\u0e14\", \"19\": \"\u0e1e\u0e38\u0e17\u0e23\u0e32\", \"20\": \"\u0e02\u0e19\u0e38\u0e19\",\n        \"21\": \"\u0e1d\u0e23\u0e31\u0e48\u0e07\", \"22\": \"\u0e19\u0e49\u0e2d\u0e22\u0e2b\u0e19\u0e48\u0e32\", \"23\": \"\u0e41\u0e15\u0e07\u0e42\u0e21\", \"24\": \"\u0e21\u0e31\u0e19\u0e41\u0e01\u0e27\", \"25\": \"\u0e01\u0e23\u0e30\u0e17\u0e49\u0e2d\u0e19\",\n        \"26\": \"\u0e01\u0e25\u0e49\u0e27\u0e22\u0e19\u0e49\u0e33\u0e27\u0e49\u0e32\", \"27\": \"\u0e21\u0e30\u0e40\u0e02\u0e37\u0e2d\u0e1e\u0e27\u0e07\", \"28\": \"\u0e16\u0e31\u0e48\u0e27\u0e25\u0e31\u0e19\u0e40\u0e15\u0e32\", \"29\": \"\u0e21\u0e30\u0e23\u0e30\", \"30\": \"\u0e01\u0e30\u0e0a\u0e32\u0e22\",\n        \"31\": \"\u0e21\u0e31\u0e19\u0e2a\u0e33\u0e1b\u0e30\u0e2b\u0e25\u0e31\u0e07\", \"32\": \"\u0e2b\u0e31\u0e27\u0e1b\u0e25\u0e35\", \"33\": \"\u0e1e\u0e23\u0e34\u0e01\", \"34\": \"\u0e1f\u0e31\u0e01\u0e17\u0e2d\u0e07\", \n        \"35\": \"(\u0e0a\u0e19\u0e34\u0e14\u0e17\u0e35\u0e48\u0e04\u0e19\u0e23\u0e31\u0e1a\u0e1b\u0e23\u0e30\u0e17\u0e32\u0e19\u0e42\u0e14\u0e22\u0e15\u0e49\u0e21\u0e43\u0e2a\u0e48\u0e40\u0e01\u0e25\u0e37\u0e2d)\", \"36\": \"(\u0e0a\u0e19\u0e34\u0e14\u0e17\u0e35\u0e48\u0e40\u0e2d\u0e32\u0e44\u0e1b\u0e17\u0e33\u0e40\u0e1b\u0e47\u0e19\u0e41\u0e1b\u0e49\u0e07)\", \n        \"37\": \"\u0e40\u0e21\u0e47\u0e14\u0e21\u0e30\u0e21\u0e48\u0e27\u0e07\u0e2b\u0e34\u0e21\u0e1e\u0e32\u0e19\u0e15\u0e4c\", \"38\": \"\u0e14\u0e2d\u0e01\u0e25\u0e31\u0e48\u0e19\u0e17\u0e21\", \"39\": \"\u0e08\u0e34\u0e49\u0e07\u0e08\u0e01\", \"40\": \"\u0e15\u0e38\u0e4a\u0e01\u0e41\u0e01\",\n        \"41\": \"\u0e41\u0e21\u0e25\u0e07\u0e2a\u0e32\u0e1a\", \"42\": \"\u0e04\u0e32\u0e07\u0e04\u0e01\", \"43\": \"\u0e01\u0e34\u0e49\u0e07\u0e01\u0e48\u0e32\", \"44\": \"\u0e1b\u0e25\u0e32\u0e0a\u0e48\u0e2d\u0e19\", \"45\": \"\u0e1b\u0e25\u0e32\u0e44\u0e2b\u0e25\",\n        \"46\": \"\u0e25\u0e39\u0e01\u0e19\u0e49\u0e33\", \"47\": \"\u0e04\u0e49\u0e32\u0e07\u0e04\u0e32\u0e27\", \"48\": \"\u0e41\u0e21\u0e07\u0e1b\u0e2d\", \"49\": \"\u0e1c\u0e35\u0e40\u0e2a\u0e37\u0e49\u0e2d\", \"50\": \"\u0e19\u0e01\u0e2b\u0e31\u0e27\u0e02\u0e27\u0e32\u0e19\",\n        \"51\": \"\u0e20\u0e39\u0e40\u0e02\u0e32\", \"52\": \"\u0e19\u0e49\u0e33\u0e04\u0e49\u0e32\u0e07\", \"53\": \"\u0e40\u0e21\u0e06\", \"54\": \"\u0e15\u0e30\u0e44\u0e04\u0e23\u0e48\u0e19\u0e49\u0e33\", \"55\": \"\u0e15\u0e30\u0e01\u0e2d\u0e19\",\n        \"56\": \"\u0e27\u0e38\u0e49\u0e19\u0e40\u0e2a\u0e49\u0e19\", \"57\": \"\u0e02\u0e49\u0e32\u0e27\u0e1c\u0e31\u0e14\", \"58\": \"\u0e44\u0e02\u0e48\u0e40\u0e08\u0e35\u0e22\u0e27\", \"59\": \"\u0e01\u0e30\u0e1b\u0e34\", \"60\": \"\u0e1b\u0e25\u0e32\u0e23\u0e49\u0e32\",\n        \"61\": \"\u0e2a\u0e49\u0e21\u0e15\u0e33\", \"62\": \"\u0e02\u0e19\u0e21\u0e08\u0e35\u0e19\", \"63\": \"\u0e02\u0e49\u0e32\u0e27\u0e15\u0e49\u0e21\u0e21\u0e31\u0e14\", \"64\": \"\u0e1b\u0e32\u0e17\u0e48\u0e2d\u0e07\u0e42\u0e01\u0e4b\", \"65\": \"\u0e40\u0e09\u0e32\u0e01\u0e4a\u0e27\u0e22\",\n        \"66\": \"\u0e2b\u0e27\u0e22\", \"67\": \"67\", \"68\": \"68\", \"69\": \"\u0e40\u0e02\u0e47\u0e21\u0e02\u0e31\u0e14\", \"70\": \"\u0e01\u0e32\u0e07\u0e40\u0e01\u0e07\",\n        \"71\": \"\u0e1c\u0e49\u0e32\u0e02\u0e32\u0e27\u0e21\u0e49\u0e32\", \"72\": \"\u0e1c\u0e49\u0e32\u0e2b\u0e48\u0e21\", \"73\": \"\u0e23\u0e48\u0e21\", \"74\": \"\u0e01\u0e23\u0e30\u0e14\u0e38\u0e21\", \"75\": \"\u0e0a\u0e49\u0e2d\u0e19\",\n        \"76\": \"\u0e41\u0e01\u0e49\u0e27\", \"77\": \"\u0e44\u0e21\u0e49\u0e02\u0e35\u0e14\u0e44\u0e1f\", \"78\": \"\u0e02\u0e35\u0e49\u0e44\u0e15\u0e49\", \"79\": \"\u0e40\u0e2a\u0e27\u0e35\u0e22\u0e19\u0e23\u0e2d\u0e07\u0e2b\u0e21\u0e49\u0e2d\", \"80\": \"\u0e15\u0e30\u0e2b\u0e25\u0e34\u0e27\",\n        \"81\": \"\u0e01\u0e23\u0e30\u0e15\u0e48\u0e32\u0e22\u0e02\u0e39\u0e14\u0e21\u0e30\u0e1e\u0e23\u0e49\u0e32\u0e27\", \"82\": \"\u0e01\u0e30\u0e25\u0e30\u0e21\u0e31\u0e07\", \"83\": \"\u0e15\u0e30\u0e1b\u0e39\", \"84\": \"\u0e40\u0e2a\u0e37\u0e48\u0e2d\", \"85\": \"\u0e15\u0e30\u0e01\u0e23\u0e49\u0e32\",\n        \"86\": \"\u0e01\u0e23\u0e30\u0e1a\u0e38\u0e07\", \"87\": \"\u0e01\u0e23\u0e30\u0e17\u0e07\", \"88\": \"\u0e2a\u0e38\u0e48\u0e21\u0e44\u0e01\u0e48\", \"89\": \"\u0e44\u0e21\u0e49\u0e01\u0e27\u0e32\u0e14\", \"90\": \"\u0e44\u0e1f\u0e09\u0e32\u0e22\",\n        \"91\": \"\u0e01\u0e23\u0e30\u0e14\u0e32\u0e29\", \"92\": \"\u0e01\u0e23\u0e23\u0e44\u0e01\u0e23\", \"93\": \"\u0e1e\u0e31\u0e14\", \"94\": \"\u0e01\u0e23\u0e30\u0e08\u0e01\", \"95\": \"\u0e08\u0e2d\u0e1a\",\n        \"96\": \"\u0e01\u0e30\u0e25\u0e32\", \"97\": \"\u0e40\u0e1b\u0e25\", \"98\": \"\u0e22\u0e38\u0e49\u0e07\u0e02\u0e49\u0e32\u0e27\", \"99\": \"\u0e2a\u0e30\u0e1e\u0e32\u0e19\", \"100\": \"\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e48\u0e32\u0e07\",\n        \"101\": \"\u0e1e\u0e23\u0e30\", \"102\": \"\u0e40\u0e13\u0e23\", \"103\": \"\u0e41\u0e21\u0e48\u0e0a\u0e35\", \"104\": \"\u0e0a\u0e32\u0e22\u0e2b\u0e19\u0e38\u0e48\u0e21\", \"105\": \"105\",\n        \"106\": \"106\", \"107\": \"107\", \"108\": \"\u0e1e\u0e35\u0e48\u0e2a\u0e30\u0e43\u0e20\u0e49\", \"109\": \"\u0e1e\u0e48\u0e2d\u0e15\u0e32\/\u0e41\u0e21\u0e48\u0e22\u0e32\u0e22\", \"110\": \"\u0e2d\u0e32 (\u0e19\u0e49\u0e2d\u0e07\u0e0a\u0e32\u0e22\u0e02\u0e2d\u0e07\u0e1e\u0e48\u0e2d)\",\n        \"111\": \"\u0e2d\u0e32 (\u0e19\u0e49\u0e2d\u0e07\u0e2a\u0e32\u0e27\u0e02\u0e2d\u0e07\u0e1e\u0e48\u0e2d)\", \"112\": \"\u0e19\u0e49\u0e32 (\u0e19\u0e49\u0e2d\u0e07\u0e0a\u0e32\u0e22\u0e02\u0e2d\u0e07\u0e41\u0e21\u0e48)\", \"113\": \"\u0e19\u0e49\u0e32 (\u0e19\u0e49\u0e2d\u0e07\u0e2a\u0e32\u0e27\u0e02\u0e2d\u0e07\u0e41\u0e21\u0e48)\", \n        \"114\": \"\u0e01\u0e33\u0e19\u0e31\u0e19\", \"115\": \"\u0e1c\u0e39\u0e49\u0e43\u0e2b\u0e0d\u0e48\u0e1a\u0e49\u0e32\u0e19\", \"116\": \"\u0e40\u0e17\u0e48\u0e32\u0e44\u0e2b\u0e23\u0e48\", \"117\": \"\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e44\u0e23\", \n        \"118\": \"118\", \"119\": \"119\", \"120\": \"120\", \"121\": \"121\", \"122\": \"\u0e40\u0e14\u0e35\u0e4b\u0e22\u0e27\u0e19\u0e35\u0e49\",\n        \"123\": \"\u0e17\u0e34\u0e28\u0e40\u0e2b\u0e19\u0e37\u0e2d\/\u0e17\u0e34\u0e28\u0e43\u0e15\u0e49\", \"124\": \"\u0e1e\u0e39\u0e14\", \"125\": \"\u0e40\u0e23\u0e35\u0e22\u0e01\", \"126\": \"\u0e14\u0e39\", \"127\": \"\u0e01\u0e31\u0e14\",\n        \"128\": \"\u0e40\u0e14\u0e34\u0e19\", \"129\": \"\u0e27\u0e34\u0e48\u0e07\", \"130\": \"\u0e23\u0e35\u0e1a\", \"131\": \"\u0e17\u0e33\u0e07\u0e32\u0e19\", \"132\": \"\u0e1b\u0e2d\u0e01\",\n        \"133\": \"\u0e15\u0e31\u0e14\", \"134\": \"\u0e25\u0e49\u0e27\u0e07\", \"135\": \"\u0e19\u0e34\u0e19\u0e17\u0e32\", \"136\": \"\u0e42\u0e01\u0e2b\u0e01\", \"137\": \"\u0e2b\u0e01\",\n        \"138\": \"\u0e1b\u0e23\u0e2d\u0e22 \u0e46\", \"139\": \"\u0e42\u0e01\u0e19\", \"140\": \"\u0e25\u0e30\u0e40\u0e21\u0e2d\", \"141\": \"\u0e04\u0e25\u0e38\u0e21\u0e42\u0e1b\u0e07\", \"142\": \"\u0e40\u0e1b\u0e47\u0e19\u0e2b\u0e48\u0e27\u0e07\",\n        \"143\": \"\u0e40\u0e1a\u0e35\u0e22\u0e14\", \"144\": \"\u0e23\u0e33\u0e04\u0e32\u0e0d\", \"145\": \"\u0e40\u0e1a\u0e37\u0e48\u0e2d\", \"146\": \"\u0e01\u0e25\u0e31\u0e27\", \"147\": \"\u0e2a\u0e07\u0e2a\u0e32\u0e23\",\n        \"148\": \"\u0e04\u0e34\u0e14\u0e16\u0e36\u0e07\", \"149\": \"\u0e40\u0e27\u0e35\u0e22\u0e19\u0e2b\u0e31\u0e27\", \"150\": \"\u0e40\u0e1b\u0e47\u0e19\u0e40\u0e2b\u0e19\u0e47\u0e1a\", \"151\": \"\u0e40\u0e23\u0e2d\", \"152\": \"\u0e01\u0e48\u0e2d\u0e44\u0e1f\",\n        \"153\": \"\u0e42\u0e01\u0e23\u0e18\", \"154\": \"\u0e02\u0e32\u0e14\", \"155\": \"\u0e41\u0e17\u0e49\u0e07\", \"156\": \"\u0e2d\u0e23\u0e48\u0e2d\u0e22\", \"157\": \"\u0e40\u0e1b\u0e23\u0e35\u0e49\u0e22\u0e27\",\n        \"158\": \"\u0e2a\u0e19\u0e38\u0e01\", \"159\": \"\u0e2d\u0e49\u0e27\u0e19\", \"160\": \"\u0e1c\u0e2d\u0e21\", \"161\": \"\u0e02\u0e22\u0e31\u0e19\", \"162\": \"\u0e09\u0e25\u0e32\u0e14\",\n        \"163\": \"\u0e14\u0e38\", \"164\": \"\u0e19\u0e32\u0e19\", \"165\": \"\u0e43\u0e01\u0e25\u0e49\", \"166\": \"\u0e40\u0e23\u0e47\u0e27\", \"167\": \"\u0e43\u0e1a\u0e49\",\n        \"168\": \"\u0e02\u0e49\u0e32\u0e27\u0e40\u0e0a\u0e49\u0e32\", \"169\": \"\u0e02\u0e49\u0e32\u0e27\u0e01\u0e25\u0e32\u0e07\u0e27\u0e31\u0e19\", \"170\": \"\u0e02\u0e49\u0e32\u0e27\u0e40\u0e22\u0e47\u0e19\"\n    };\n\n    \/\/ 2. \u0e15\u0e23\u0e27\u0e08\u0e2a\u0e2d\u0e1a\u0e04\u0e48\u0e32 n \u0e41\u0e25\u0e30\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\n    if (n && titles[n]) {\n        h1Element.innerText = titles[n];\n    \/\/} else if (n === \"0\") {\n        \/\/h1Element.innerText = \"\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e08\u0e21\u0e39\u0e01 (\u0e1e\u0e34\u0e40\u0e28\u0e29)\";\n    } else {\n        h1Element.innerText = \"\u0e44\u0e21\u0e48\u0e1e\u0e1a\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\";\n        nDisplay.innerText = \"\u0e42\u0e1b\u0e23\u0e14\u0e23\u0e30\u0e1a\u0e38\u0e04\u0e48\u0e32 n \u0e17\u0e35\u0e48\u0e16\u0e39\u0e01\u0e15\u0e49\u0e2d\u0e07\";\n    }\n});\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-702c460 elementor-widget elementor-widget-html\" data-id=\"702c460\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div id=\"dynamic-container\" style=\"max-width: 1000px; margin: 0 auto;\">\n    <div id=\"chart-section\" class=\"map-item\"><\/div>\n    <div id=\"table-section\" class=\"map-item\"><\/div>\n    <hr style=\"margin: 40px 0; border: 0; border-top: 1px solid #eee;\">\n    <div id=\"maps-loop-section\" style=\"display: flex; flex-wrap: wrap; gap: 20px; justify-content: center;\"><\/div>\n<\/div>\n\n<div id=\"imageModal\" class=\"custom-modal\">\n    <span class=\"close-modal\">&times;<\/span>\n    <img class=\"modal-content\" id=\"imgFull\">\n<\/div>\n\n<style>\n    .map-item { text-align: center; margin-bottom: 30px; }\n    .map-item img { \n        max-width: 100%; height: auto; border-radius: 5px; \n        box-shadow: 0 2px 10px rgba(0,0,0,0.1); \n        cursor: pointer; transition: 0.3s;\n    }\n    .map-item img:hover { opacity: 0.8; }\n\n    .custom-modal {\n        display: none; position: fixed; z-index: 9999;\n        left: 0; top: 0; width: 100%; height: 100%;\n        background-color: rgba(0,0,0,0.9); padding-top: 50px;\n    }\n    .modal-content {\n        margin: auto; display: block; width: auto;\n        max-width: 90%; max-height: 85vh; border: 3px solid #fff;\n    }\n    .close-modal {\n        position: absolute; top: 15px; right: 35px;\n        color: #fff; font-size: 40px; font-weight: bold; cursor: pointer;\n    }\n<\/style>\n\n<script>\n\/\/ 1. \u0e1b\u0e23\u0e30\u0e01\u0e32\u0e28\u0e1f\u0e31\u0e07\u0e01\u0e4c\u0e0a\u0e31\u0e19\u0e40\u0e1b\u0e34\u0e14 Modal \u0e44\u0e27\u0e49\u0e02\u0e49\u0e32\u0e07\u0e19\u0e2d\u0e01\u0e2a\u0e38\u0e14 (Global Scope)\nfunction openModal(src) {\n    const modal = document.getElementById(\"imageModal\");\n    const modalImg = document.getElementById(\"imgFull\");\n    if(modal && modalImg) {\n        modal.style.display = \"block\";\n        modalImg.src = src;\n    }\n}\n\ndocument.addEventListener(\"DOMContentLoaded\", function() {\n    const params = new URLSearchParams(window.location.search);\n    const n = params.get('n');\n    \n    if (!n) {\n        document.getElementById('dynamic-container').innerHTML = \"<h3>\u0e01\u0e23\u0e38\u0e13\u0e32\u0e23\u0e30\u0e1a\u0e38\u0e01\u0e25\u0e38\u0e48\u0e21\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25 (\u0e40\u0e0a\u0e48\u0e19 ?n=1)<\/h3>\";\n        return;\n    }\n\n    const nInt = parseInt(n);\n    const imageBaseUrl = \"\/geography\/wp-content\/uploads\/2026\/01\/\";\n    const modal = document.getElementById(\"imageModal\");\n    const closeBtn = document.querySelector(\".close-modal\");\n\n    \/\/ \u0e1b\u0e34\u0e14 Modal\n    if(closeBtn) closeBtn.onclick = () => modal.style.display = \"none\";\n    if(modal) modal.onclick = (e) => { if(e.target === modal) modal.style.display = \"none\"; };\n\n    \/\/ 1. \u0e08\u0e31\u0e14\u0e01\u0e32\u0e23\u0e23\u0e39\u0e1b Chart & Table\n    const chartSection = document.getElementById('chart-section');\n    const tableSection = document.getElementById('table-section');\n    \n    let cName = `chart-${nInt-2}.jpg`;\n    let tName = `table-${nInt-2}.jpg`;\n\n    if(nInt === 0){\n        cName = `Picture3.1_\u0e08\u0e21\u0e39\u0e01-piechart.jpg`;\n        tName = `Picture3.2_\u0e08\u0e21\u0e39\u0e01-table.jpg`;\n    } else if(nInt === 1) {\n        cName = `chart.jpg`;\n        tName = `table.jpg`;\n    }else if(nInt >= 76 && nInt <= 105) {\n        cName = `chart-${nInt-37}.jpg`;\n        tName = `table-${nInt-37}.jpg`;\n    \n    }else if(nInt === 42) {\n        cName = `chart.gif`;\n        tName = `table.gif`;\n    }else if (nInt >= 59) {\n        cName = `chart-${nInt}.gif`;\n        tName = `table-${nInt}.gif`;\n    }else if(nInt > 42) {\n        cName = `chart-${nInt-42}.gif`;\n        tName = `table-${nInt-42}.gif`;\n    }\n\n    \/\/ \u0e41\u0e01\u0e49\u0e44\u0e02: \u0e43\u0e0a\u0e49 Template Literal \u0e04\u0e23\u0e2d\u0e1a URL \u0e43\u0e2b\u0e49\u0e16\u0e39\u0e01\u0e15\u0e49\u0e2d\u0e07\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e2a\u0e48\u0e07\u0e40\u0e02\u0e49\u0e32\u0e1f\u0e31\u0e07\u0e01\u0e4c\u0e0a\u0e31\u0e19\n    chartSection.innerHTML = `<img decoding=\"async\" src=\"${imageBaseUrl}${cName}\" onclick=\"openModal('${imageBaseUrl}${cName}')\">`;\n    tableSection.innerHTML = `<img decoding=\"async\" src=\"${imageBaseUrl}${tName}\" onclick=\"openModal('${imageBaseUrl}${tName}')\">`;\n\n    \/\/ 2. \u0e1f\u0e31\u0e07\u0e01\u0e4c\u0e0a\u0e31\u0e19 Loop \u0e2b\u0e32\u0e23\u0e39\u0e1b Map\n    const loopContainer = document.getElementById('maps-loop-section');\n    let pos = 1;\n\n    function findNextMap(currentPos) {\n        const fileName = `map-n${n}-${currentPos}.gif`;\n        const fullUrl = imageBaseUrl + fileName;\n        const imgTest = new Image();\n        \n        imgTest. {\n            const div = document.createElement('div');\n            div.className = 'map-item';\n            div.style.width = '45%'; \n            div.innerHTML = `<img decoding=\"async\" src=\"${fullUrl}\" onclick=\"openModal('${fullUrl}')\">`;\n            \n            loopContainer.appendChild(div);\n            findNextMap(currentPos + 1);\n        };\n        \n        imgTest. { \/* \u0e08\u0e1a loop *\/ };\n        imgTest.src = fullUrl;\n    }\n\n    findNextMap(pos);\n});\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u2190 \u0e22\u0e49\u0e2d\u0e19\u0e01\u0e25\u0e31\u0e1a \u0e01\u0e33\u0e25\u0e31\u0e07\u0e42\u0e2b\u0e25\u0e14\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25&#8230; &times;<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-2334","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.arts.chula.ac.th\/geography\/index.php?rest_route=\/wp\/v2\/pages\/2334","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.arts.chula.ac.th\/geography\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.arts.chula.ac.th\/geography\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.arts.chula.ac.th\/geography\/index.php?rest_route=\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.arts.chula.ac.th\/geography\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2334"}],"version-history":[{"count":101,"href":"https:\/\/www.arts.chula.ac.th\/geography\/index.php?rest_route=\/wp\/v2\/pages\/2334\/revisions"}],"predecessor-version":[{"id":3815,"href":"https:\/\/www.arts.chula.ac.th\/geography\/index.php?rest_route=\/wp\/v2\/pages\/2334\/revisions\/3815"}],"wp:attachment":[{"href":"https:\/\/www.arts.chula.ac.th\/geography\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2334"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}