{"id":1783,"date":"2026-04-30T19:49:52","date_gmt":"2026-04-30T12:49:52","guid":{"rendered":"https:\/\/doaction.co.th\/?post_type=portfolio&#038;p=1783"},"modified":"2026-04-30T20:03:35","modified_gmt":"2026-04-30T13:03:35","slug":"bangkok-index","status":"publish","type":"portfolio","link":"https:\/\/doaction.co.th\/en\/portfolio\/bangkok-index\/","title":{"rendered":"Bangkok Index"},"content":{"rendered":"<p class=\"wp-block-paragraph\">\u0e1e\u0e31\u0e12\u0e19\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c Data Visualization \u0e17\u0e35\u0e48\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e04\u0e30\u0e41\u0e19\u0e19\u0e41\u0e25\u0e30\u0e2d\u0e31\u0e19\u0e14\u0e31\u0e1a\u0e04\u0e27\u0e32\u0e21\u0e19\u0e48\u0e32\u0e2d\u0e22\u0e39\u0e48\u0e02\u0e2d\u0e07\u0e17\u0e31\u0e49\u0e07 50 \u0e40\u0e02\u0e15\u0e43\u0e19\u0e01\u0e23\u0e38\u0e07\u0e40\u0e17\u0e1e\u0e21\u0e2b\u0e32\u0e19\u0e04\u0e23 \u0e1c\u0e48\u0e32\u0e19\u0e01\u0e32\u0e23\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e41\u0e1a\u0e1a Interactive \u0e17\u0e31\u0e49\u0e07\u0e43\u0e19\u0e23\u0e39\u0e1b\u0e41\u0e1a\u0e1a\u0e41\u0e1c\u0e19\u0e17\u0e35\u0e48\u0e41\u0e25\u0e30\u0e01\u0e23\u0e32\u0e1f \u0e42\u0e14\u0e22\u0e40\u0e19\u0e49\u0e19\u0e01\u0e32\u0e23\u0e1b\u0e23\u0e30\u0e21\u0e27\u0e25\u0e1c\u0e25\u0e1d\u0e31\u0e48\u0e07 Frontend \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e43\u0e2b\u0e49\u0e1c\u0e39\u0e49\u0e43\u0e0a\u0e49\u0e44\u0e14\u0e49\u0e23\u0e31\u0e1a\u0e1b\u0e23\u0e30\u0e2a\u0e1a\u0e01\u0e32\u0e23\u0e13\u0e4c\u0e17\u0e35\u0e48\u0e25\u0e37\u0e48\u0e19\u0e44\u0e2b\u0e25 \u0e23\u0e27\u0e14\u0e40\u0e23\u0e47\u0e27 \u0e41\u0e25\u0e30\u0e40\u0e02\u0e49\u0e32\u0e43\u0e08\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e44\u0e14\u0e49\u0e07\u0e48\u0e32\u0e22\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"\u0e1f-\u0e40\u0e08\u0e2d\u0e23-\u0e2b\u0e25-\u0e01\u0e02\u0e2d\u0e07\u0e23\u0e30\u0e1a\u0e1a\">\u0e1f\u0e35\u0e40\u0e08\u0e2d\u0e23\u0e4c\u0e2b\u0e25\u0e31\u0e01\u0e02\u0e2d\u0e07\u0e23\u0e30\u0e1a\u0e1a<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Interactive Map \u0e14\u0e49\u0e27\u0e22 D3.js<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u0e41\u0e2a\u0e14\u0e07\u0e41\u0e1c\u0e19\u0e17\u0e35\u0e48\u0e01\u0e23\u0e38\u0e07\u0e40\u0e17\u0e1e\u0e2f \u0e41\u0e1a\u0e1a SVG \u0e04\u0e23\u0e1a\u0e17\u0e31\u0e49\u0e07 50 \u0e40\u0e02\u0e15<\/li>\n\n\n\n<li>\u0e23\u0e30\u0e1a\u0e1a\u0e2a\u0e35\u0e41\u0e1a\u0e1a Choropleth Map \u0e01\u0e33\u0e2b\u0e19\u0e14\u0e2a\u0e35\u0e15\u0e32\u0e21\u0e23\u0e30\u0e14\u0e31\u0e1a\u0e04\u0e30\u0e41\u0e19\u0e19\u0e04\u0e27\u0e32\u0e21\u0e19\u0e48\u0e32\u0e2d\u0e22\u0e39\u0e48\u0e02\u0e2d\u0e07\u0e41\u0e15\u0e48\u0e25\u0e30\u0e40\u0e02\u0e15<\/li>\n\n\n\n<li>\u0e04\u0e25\u0e34\u0e01\u0e40\u0e02\u0e15\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e14\u0e39\u0e23\u0e32\u0e22\u0e25\u0e30\u0e40\u0e2d\u0e35\u0e22\u0e14\u0e04\u0e30\u0e41\u0e19\u0e19\u0e40\u0e0a\u0e34\u0e07\u0e25\u0e36\u0e01<\/li>\n\n\n\n<li>Hover Tooltip \u0e41\u0e2a\u0e14\u0e07\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e2a\u0e23\u0e38\u0e1b\u0e41\u0e1a\u0e1a Real-time<\/li>\n\n\n\n<li>Zoom \u0e41\u0e25\u0e30 Pan \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e14\u0e39\u0e23\u0e32\u0e22\u0e25\u0e30\u0e40\u0e2d\u0e35\u0e22\u0e14\u0e41\u0e1c\u0e19\u0e17\u0e35\u0e48\u0e43\u0e19\u0e41\u0e15\u0e48\u0e25\u0e30\u0e1e\u0e37\u0e49\u0e19\u0e17\u0e35\u0e48<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>\u0e01\u0e23\u0e32\u0e1f\u0e41\u0e17\u0e48\u0e07\u0e41\u0e19\u0e27\u0e19\u0e2d\u0e19 (Horizontal Bar Chart)<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u0e41\u0e2a\u0e14\u0e07\u0e2d\u0e31\u0e19\u0e14\u0e31\u0e1a\u0e04\u0e27\u0e32\u0e21\u0e19\u0e48\u0e32\u0e2d\u0e22\u0e39\u0e48\u0e02\u0e2d\u0e07\u0e17\u0e31\u0e49\u0e07 50 \u0e40\u0e02\u0e15\u0e40\u0e23\u0e35\u0e22\u0e07\u0e25\u0e33\u0e14\u0e31\u0e1a\u0e08\u0e32\u0e01\u0e21\u0e32\u0e01\u0e44\u0e1b\u0e19\u0e49\u0e2d\u0e22<\/li>\n\n\n\n<li>Filter \u0e41\u0e25\u0e30 Sort \u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e15\u0e32\u0e21\u0e21\u0e34\u0e15\u0e34\u0e15\u0e48\u0e32\u0e07 \u0e46 \u0e44\u0e14\u0e49<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>\u0e23\u0e30\u0e1a\u0e1a\u0e40\u0e1b\u0e23\u0e35\u0e22\u0e1a\u0e40\u0e17\u0e35\u0e22\u0e1a\u0e40\u0e02\u0e15 (District Comparison)<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e2b\u0e25\u0e32\u0e22\u0e40\u0e02\u0e15\u0e21\u0e32\u0e40\u0e1b\u0e23\u0e35\u0e22\u0e1a\u0e40\u0e17\u0e35\u0e22\u0e1a\u0e04\u0e30\u0e41\u0e19\u0e19\u0e41\u0e15\u0e48\u0e25\u0e30\u0e14\u0e49\u0e32\u0e19\u0e1e\u0e23\u0e49\u0e2d\u0e21\u0e01\u0e31\u0e19<\/li>\n\n\n\n<li>\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e41\u0e1a\u0e1a Side-by-side \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e43\u0e2b\u0e49\u0e40\u0e2b\u0e47\u0e19\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e44\u0e14\u0e49\u0e0a\u0e31\u0e14\u0e40\u0e08\u0e19<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Frontend-first Architecture<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u0e1b\u0e23\u0e30\u0e21\u0e27\u0e25\u0e1c\u0e25\u0e41\u0e25\u0e30 Render \u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14\u0e1d\u0e31\u0e48\u0e07 Frontend<\/li>\n\n\n\n<li>\u0e25\u0e14 Server Request \u0e43\u0e2b\u0e49\u0e19\u0e49\u0e2d\u0e22\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e40\u0e23\u0e47\u0e27\u0e2a\u0e39\u0e07\u0e2a\u0e38\u0e14<\/li>\n\n\n\n<li>\u0e43\u0e0a\u0e49 D3.js \u0e04\u0e27\u0e1a\u0e04\u0e38\u0e21 DOM \u0e41\u0e25\u0e30 Animation \u0e17\u0e38\u0e01\u0e08\u0e38\u0e14\u0e41\u0e1a\u0e1a Custom<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"1429\" src=\"https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-1-scaled.png\" alt=\"\" class=\"wp-image-1848\" srcset=\"https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-1-scaled.png 2560w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-1-300x167.png 300w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-1-1024x571.png 1024w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-1-768x429.png 768w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-1-1536x857.png 1536w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-1-2048x1143.png 2048w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-1-18x10.png 18w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"1424\" src=\"https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-2-scaled.png\" alt=\"\" class=\"wp-image-1850\" srcset=\"https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-2-scaled.png 2560w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-2-300x167.png 300w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-2-1024x570.png 1024w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-2-768x427.png 768w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-2-1536x854.png 1536w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-2-2048x1139.png 2048w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-2-18x10.png 18w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"1425\" src=\"https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-3-scaled.png\" alt=\"\" class=\"wp-image-1852\" srcset=\"https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-3-scaled.png 2560w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-3-300x167.png 300w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-3-1024x570.png 1024w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-3-768x427.png 768w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-3-1536x855.png 1536w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-3-2048x1140.png 2048w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-3-18x10.png 18w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"1425\" src=\"https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-4-scaled.png\" alt=\"\" class=\"wp-image-1849\" srcset=\"https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-4-scaled.png 2560w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-4-300x167.png 300w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-4-1024x570.png 1024w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-4-768x427.png 768w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-4-1536x855.png 1536w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-4-2048x1140.png 2048w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-4-18x10.png 18w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"2130\" src=\"https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-5-scaled.png\" alt=\"\" class=\"wp-image-1851\" srcset=\"https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-5-scaled.png 2560w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-5-300x250.png 300w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-5-1024x852.png 1024w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-5-768x639.png 768w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-5-1536x1278.png 1536w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-5-2048x1704.png 2048w, https:\/\/doaction.co.th\/wp-content\/uploads\/2026\/04\/bkk-index-5-14x12.png 14w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><\/figure>","protected":false},"featured_media":1793,"parent":0,"template":"","portfolio-tag":[],"portfolio-type":[69],"portfolio-year":[],"class_list":["post-1783","portfolio","type-portfolio","status-publish","has-post-thumbnail","hentry","portfolio-type-information-website"],"acf":[],"_links":{"self":[{"href":"https:\/\/doaction.co.th\/en\/wp-json\/wp\/v2\/portfolio\/1783","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/doaction.co.th\/en\/wp-json\/wp\/v2\/portfolio"}],"about":[{"href":"https:\/\/doaction.co.th\/en\/wp-json\/wp\/v2\/types\/portfolio"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/doaction.co.th\/en\/wp-json\/wp\/v2\/media\/1793"}],"wp:attachment":[{"href":"https:\/\/doaction.co.th\/en\/wp-json\/wp\/v2\/media?parent=1783"}],"wp:term":[{"taxonomy":"portfolio-tag","embeddable":true,"href":"https:\/\/doaction.co.th\/en\/wp-json\/wp\/v2\/portfolio-tag?post=1783"},{"taxonomy":"portfolio-type","embeddable":true,"href":"https:\/\/doaction.co.th\/en\/wp-json\/wp\/v2\/portfolio-type?post=1783"},{"taxonomy":"portfolio-year","embeddable":true,"href":"https:\/\/doaction.co.th\/en\/wp-json\/wp\/v2\/portfolio-year?post=1783"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}