{"id":1824,"date":"2025-08-30T09:05:33","date_gmt":"2025-08-30T02:05:33","guid":{"rendered":"https:\/\/arit.pcru.ac.th\/greenoffice\/?page_id=1824"},"modified":"2025-09-26T15:41:17","modified_gmt":"2025-09-26T08:41:17","slug":"waste","status":"publish","type":"page","link":"https:\/\/arit.pcru.ac.th\/greenoffice\/waste\/","title":{"rendered":"\u0e1b\u0e23\u0e34\u0e21\u0e32\u0e13\u0e02\u0e2d\u0e07\u0e40\u0e2a\u0e35\u0e22"},"content":{"rendered":"\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n        <style>\r\n            @import url('https:\/\/fonts.googleapis.com\/css2?family=Sarabun:wght@400;600;700&display=swap');\r\n\r\n            .gom-wrap-green {\r\n                --p: #16a34a;\r\n                --p2: #34d399;\r\n                --p-200: #dcfce7;\r\n                --p-600: #15803d;\r\n                --border: #e5efe7;\r\n                --muted: #6b7280;\r\n                font-family: 'Sarabun', system-ui;\r\n                color: #1f2937;\r\n                background: #f6fbf7;\r\n            }\r\n\r\n            \/* ===== HERO V2 (\u0e08\u0e32\u0e01\u0e42\u0e04\u0e49\u0e14\u0e01\u0e23\u0e30\u0e14\u0e32\u0e29) ===== *\/\r\n            .gom-heroV2 {\r\n                background: linear-gradient(100deg, var(--p), var(--p2));\r\n                border-radius: 20px;\r\n                padding: 18px 20px;\r\n                color: #fff;\r\n                box-shadow: 0 4px 16px rgba(22, 163, 74, .15);\r\n                margin-bottom: 12px;\r\n            }\r\n\r\n            .gom-heroV2 h2 {\r\n                margin: 0 0 10px;\r\n                font-size: 22px;\r\n                font-weight: 700;\r\n                color: #fff;\r\n            }\r\n\r\n            .gom-hero-row {\r\n                display: flex;\r\n                align-items: center;\r\n                justify-content: space-between;\r\n                gap: 12px;\r\n                flex-wrap: wrap;\r\n            }\r\n\r\n            .gom-chip {\r\n                display: inline-flex;\r\n                align-items: center;\r\n                gap: 8px;\r\n                padding: 8px 14px;\r\n                border-radius: 999px;\r\n                font-weight: 700;\r\n                font-size: 14px;\r\n                line-height: 1;\r\n                background: rgba(255, 255, 255, .18);\r\n                border: 1px solid rgba(255, 255, 255, .35);\r\n                color: #fff;\r\n            }\r\n\r\n            \/* ===== TOOLBAR (\u0e15\u0e31\u0e27\u0e01\u0e23\u0e2d\u0e07 + \u0e1b\u0e35) ===== *\/\r\n            .gom-toolbar {\r\n                background: #f7fbf8;\r\n                border: 1px solid var(--border);\r\n                border-radius: 14px;\r\n                padding: 12px;\r\n                margin: 14px 0;\r\n                display: flex;\r\n                align-items: center;\r\n                justify-content: space-between;\r\n                gap: 12px;\r\n                flex-wrap: wrap;\r\n            }\r\n\r\n            .gom-toolbar .left {\r\n                display: flex;\r\n                align-items: center;\r\n                gap: 10px;\r\n                flex-wrap: wrap;\r\n            }\r\n\r\n            .gom-toolbar label {\r\n                font-weight: 700;\r\n                color: #0b3d1d;\r\n            }\r\n\r\n            .gom-toolbar select {\r\n                padding: 8px 10px;\r\n                border: 1px solid var(--border);\r\n                border-radius: 10px;\r\n                background: #fff;\r\n                min-width: 240px;\r\n            }\r\n\r\n            \/* \u0e1b\u0e38\u0e48\u0e21\u0e2a\u0e25\u0e31\u0e1a\u0e1b\u0e35\u0e41\u0e1a\u0e1a pill *\/\r\n            .gom-year-pills {\r\n                display: flex;\r\n                align-items: center;\r\n                gap: 8px;\r\n                flex-wrap: wrap;\r\n            }\r\n\r\n            .gom-year-pills a {\r\n                text-decoration: none;\r\n                display: inline-block;\r\n                padding: 8px 14px;\r\n                border-radius: 999px;\r\n                border: 1px solid #cfe8d7;\r\n                background: #fff;\r\n                color: #0b3d1d;\r\n                font-weight: 700;\r\n            }\r\n\r\n            .gom-year-pills a.active {\r\n                background: var(--p);\r\n                border-color: var(--p);\r\n                color: #fff;\r\n            }\r\n\r\n            \/* \u0e01\u0e32\u0e23\u0e4c\u0e14\u0e2a\u0e23\u0e38\u0e1b *\/\r\n            .gom-cards {\r\n                display: grid;\r\n                grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));\r\n                gap: 14px;\r\n                margin: 14px 0 16px;\r\n            }\r\n\r\n            .gom-card {\r\n                background: #fff;\r\n                border: 1px solid var(--border);\r\n                border-radius: 14px;\r\n                padding: 16px;\r\n                display: flex;\r\n                align-items: center;\r\n                gap: 12px;\r\n            }\r\n\r\n            .gom-card .icon {\r\n                width: 42px;\r\n                height: 42px;\r\n                border-radius: 50%;\r\n                display: flex;\r\n                align-items: center;\r\n                justify-content: center;\r\n                background: var(--p-200);\r\n                color: var(--p-600);\r\n            }\r\n\r\n            .gom-card h4 {\r\n                margin: 0;\r\n                font-size: 13px;\r\n                color: var(--muted);\r\n                font-weight: 600;\r\n            }\r\n\r\n            .gom-card p {\r\n                margin: 2px 0 0;\r\n                font-size: 20px;\r\n                font-weight: 700;\r\n            }\r\n\r\n            \/* \u0e01\u0e25\u0e48\u0e2d\u0e07 Section + Chart *\/\r\n            .gom-section {\r\n                background: #fff;\r\n                border: 1px solid var(--border);\r\n                border-radius: 14px;\r\n                padding: 18px;\r\n                margin-bottom: 14px;\r\n            }\r\n\r\n            .gom-section h3 {\r\n                margin: 0 0 10px;\r\n                font-size: 18px;\r\n                font-weight: 700;\r\n                color: #0b3d1d;\r\n            }\r\n\r\n            .gom-chart-wrap {\r\n                position: relative;\r\n                height: 380px;\r\n            }\r\n\r\n            \/* Table *\/\r\n            .gom-table {\r\n                width: 100%;\r\n                border-collapse: collapse;\r\n            }\r\n\r\n            .gom-table th,\r\n            .gom-table td {\r\n                padding: 10px 12px;\r\n                border-bottom: 1px solid var(--border);\r\n            }\r\n\r\n            .gom-table thead th {\r\n                font-size: 12px;\r\n                text-transform: uppercase;\r\n                color: var(--muted);\r\n            }\r\n\r\n            .gom-table td {\r\n                font-weight: 600;\r\n                text-align: right;\r\n            }\r\n\r\n            .gom-table td:nth-child(1),\r\n            .gom-table td:nth-child(2) {\r\n                text-align: left;\r\n            }\r\n\r\n            .badge-compare {\r\n                display: inline-flex;\r\n                align-items: center;\r\n                gap: 4px;\r\n                padding: 4px 8px;\r\n                border-radius: 6px;\r\n                font-weight: 700;\r\n                font-size: 13px;\r\n            }\r\n\r\n            .badge-up {\r\n                color: #b91c1c;\r\n                background: #fee2e2;\r\n            }\r\n\r\n            .badge-down {\r\n                color: #166534;\r\n                background: #dcfce7;\r\n            }\r\n\r\n            .gom-tfoot td {\r\n                background: #f1fbf2;\r\n                font-weight: 700;\r\n            }\r\n\r\n            @media (max-width:640px) {\r\n                .gom-chart-wrap {\r\n                    height: 280px;\r\n                }\r\n            }\r\n        <\/style>\r\n\r\n        <div class=\"gom-wrap-green\">\r\n                        <div class=\"gom-heroV2\">\r\n                <div class=\"gom-hero-row\">\r\n                    <h2>\u0e2a\u0e23\u0e38\u0e1b\u0e01\u0e32\u0e23\u0e08\u0e31\u0e14\u0e01\u0e32\u0e23\u0e02\u0e2d\u0e07\u0e40\u0e2a\u0e35\u0e22 \u0e1b\u0e35 2569<\/h2>\r\n                    <span class=\"gom-chip solid\">\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e07\u0e32\u0e19: \u0e2a\u0e48\u0e27\u0e19\u0e01\u0e25\u0e32\u0e07 (\u0e17\u0e38\u0e01\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e07\u0e32\u0e19)<\/span>\r\n                    <span class=\"gom-chip ghost\">\u0e2d\u0e31\u0e15\u0e23\u0e32\u0e04\u0e48\u0e32\u0e01\u0e33\u0e08\u0e31\u0e14\u0e02\u0e2d\u0e07\u0e40\u0e2a\u0e35\u0e22 ~ 0.00 \u0e1a\u0e32\u0e17\/\u0e01\u0e01.<\/span>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <!-- \u0e41\u0e16\u0e1a\u0e15\u0e31\u0e27\u0e01\u0e23\u0e2d\u0e07 + \u0e1b\u0e38\u0e48\u0e21\u0e1b\u0e35\u0e41\u0e1a\u0e1a pill -->\r\n            <form class=\"gom-toolbar\" method=\"get\">\r\n                <div class=\"left\">\r\n                    <label>\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e07\u0e32\u0e19:<\/label>\r\n                    <select name=\"dept_id\" onchange=\"this.form.submit()\">\r\n                        <option value=\"0\">\u0e2a\u0e48\u0e27\u0e19\u0e01\u0e25\u0e32\u0e07 (\u0e17\u0e38\u0e01\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e07\u0e32\u0e19)<\/option>\r\n                                                    <option value=\"3\" >\r\n                                \u0e07\u0e32\u0e19\u0e1a\u0e23\u0e34\u0e01\u0e32\u0e23\u0e04\u0e2d\u0e21                            <\/option>\r\n                                                    <option value=\"4\" >\r\n                                \u0e07\u0e32\u0e19\u0e27\u0e34\u0e08\u0e31\u0e22\u0e0b\u0e2d\u0e1f\u0e15\u0e4c\u0e41\u0e27\u0e23\u0e4c                            <\/option>\r\n                                                    <option value=\"2\" >\r\n                                \u0e07\u0e32\u0e19\u0e2b\u0e2d\u0e2a\u0e21\u0e38\u0e14\u0e01\u0e25\u0e32\u0e07                            <\/option>\r\n                                                    <option value=\"1\" >\r\n                                \u0e2a\u0e33\u0e19\u0e31\u0e01\u0e07\u0e32\u0e19\u0e2d\u0e33\u0e19\u0e27\u0e22\u0e01\u0e32\u0e23                            <\/option>\r\n                                                    <option value=\"5\" >\r\n                                \u0e2d\u0e32\u0e04\u0e32\u0e23\u0e1a\u0e23\u0e23\u0e13\u0e23\u0e32\u0e0a\u0e19\u0e04\u0e23\u0e34\u0e19\u0e17\u0e23\u0e4c                            <\/option>\r\n                                                    <option value=\"6\" >\r\n                                \u0e40\u0e17\u0e04\u0e42\u0e19\u0e42\u0e25\u0e22\u0e35\u0e2a\u0e32\u0e23\u0e2a\u0e19\u0e40\u0e17\u0e28                            <\/option>\r\n                                            <\/select>\r\n                <\/div>\r\n                <div class=\"gom-year-pills\">\r\n                                            <a class=\"active\"\r\n                            href=\"\/greenoffice\/wp-json\/wp\/v2\/pages\/1824?gom_year=2026&#038;dept_id=0\">\r\n                            2569                        <\/a>\r\n                                            <a class=\"\"\r\n                            href=\"\/greenoffice\/wp-json\/wp\/v2\/pages\/1824?gom_year=2025&#038;dept_id=0\">\r\n                            2568                        <\/a>\r\n                                    <\/div>\r\n            <\/form>\r\n\r\n            <!-- Cards -->\r\n            <div class=\"gom-cards\">\r\n                <div class=\"gom-card\">\r\n                    <div class=\"icon\">\ud83e\uddfa<\/div>\r\n                    <div>\r\n                        <h4>\u0e1b\u0e23\u0e34\u0e21\u0e32\u0e13\u0e23\u0e27\u0e21 (\u0e1b\u0e35 2569)<\/h4>\r\n                        <p>153.42 <small>\u0e01\u0e01.<\/small><\/p>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"gom-card\">\r\n                    <div class=\"icon\">\ud83d\udcc8<\/div>\r\n                    <div>\r\n                        <h4>\u0e40\u0e09\u0e25\u0e35\u0e48\u0e22\/\u0e40\u0e14\u0e37\u0e2d\u0e19 (\u0e1b\u0e35 2569)<\/h4>\r\n                        <p>38.36 <small>\u0e01\u0e01.<\/small><\/p>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"gom-card\">\r\n                    <div class=\"icon\">\ud83d\udc64<\/div>\r\n                    <div>\r\n                        <h4>\u0e40\u0e09\u0e25\u0e35\u0e48\u0e22\/\u0e04\u0e19\/\u0e40\u0e14\u0e37\u0e2d\u0e19 (\u0e1b\u0e35 2569)<\/h4>\r\n                        <p>0.63 <small>\u0e01\u0e01.\/\u0e04\u0e19<\/small><\/p>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <!-- Chart -->\r\n            <div class=\"gom-section\">\r\n                <h3>\u0e2a\u0e23\u0e38\u0e1b\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49\u0e40\u0e1b\u0e23\u0e35\u0e22\u0e1a\u0e40\u0e17\u0e35\u0e22\u0e1a\u0e23\u0e32\u0e22\u0e1b\u0e35<\/h3>\r\n                <div class=\"gom-chart-wrap\"><canvas id=\"gomWasteChartNewUI\"><\/canvas><\/div>\r\n            <\/div>\r\n\r\n            <!-- Table -->\r\n            <div class=\"gom-section\">\r\n                <h3>\u0e15\u0e32\u0e23\u0e32\u0e07\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e1b\u0e35 2569<\/h3>\r\n                <table class=\"gom-table\">\r\n                    <thead>\r\n                        <tr>\r\n                            <th>\u0e1b\u0e35 \u0e1e.\u0e28.<\/th>\r\n                            <th>\u0e40\u0e14\u0e37\u0e2d\u0e19<\/th>\r\n                            <th>\u0e08\u0e33\u0e19\u0e27\u0e19\u0e1e\u0e19\u0e31\u0e01\u0e07\u0e32\u0e19 (\u0e04\u0e19)<\/th>\r\n                            <th>\u0e02\u0e2d\u0e07\u0e40\u0e2a\u0e35\u0e22\/\u0e40\u0e14\u0e37\u0e2d\u0e19 (\u0e01\u0e01.)<\/th>\r\n                            <th>\u0e02\u0e2d\u0e07\u0e40\u0e2a\u0e35\u0e22\/\u0e04\u0e19\/\u0e40\u0e14\u0e37\u0e2d\u0e19<\/th>\r\n                            <th>\u0e40\u0e1b\u0e23\u0e35\u0e22\u0e1a\u0e40\u0e17\u0e35\u0e22\u0e1a\u0e01\u0e31\u0e1a\u0e40\u0e14\u0e37\u0e2d\u0e19\u0e01\u0e48\u0e2d\u0e19\u0e2b\u0e19\u0e49\u0e32<\/th>\r\n                        <\/tr>\r\n                    <\/thead>\r\n                    <tbody>\r\n                                                    <tr>\r\n                                <td>2569<\/td>\r\n                                <td>\u0e21.\u0e04.<\/td>\r\n                                <td>61<\/td>\r\n                                <td>48.40<\/td>\r\n                                <td>0.79<\/td>\r\n                                <td><span class=\"badge-compare badge-down\">\u25bc \u0e25\u0e14\u0e25\u0e07 26.89%<\/span><\/td>\r\n                            <\/tr>\r\n                                                    <tr>\r\n                                <td>2569<\/td>\r\n                                <td>\u0e01.\u0e1e.<\/td>\r\n                                <td>61<\/td>\r\n                                <td>54.80<\/td>\r\n                                <td>0.90<\/td>\r\n                                <td><span class=\"badge-compare badge-up\">\u25b2 \u0e40\u0e1e\u0e34\u0e48\u0e21\u0e02\u0e36\u0e49\u0e19 13.22%<\/span><\/td>\r\n                            <\/tr>\r\n                                                    <tr>\r\n                                <td>2569<\/td>\r\n                                <td>\u0e21\u0e35.\u0e04.<\/td>\r\n                                <td>61<\/td>\r\n                                <td>38.80<\/td>\r\n                                <td>0.64<\/td>\r\n                                <td><span class=\"badge-compare badge-down\">\u25bc \u0e25\u0e14\u0e25\u0e07 29.20%<\/span><\/td>\r\n                            <\/tr>\r\n                                                    <tr>\r\n                                <td>2569<\/td>\r\n                                <td>\u0e40\u0e21.\u0e22.<\/td>\r\n                                <td>61<\/td>\r\n                                <td>11.42<\/td>\r\n                                <td>0.19<\/td>\r\n                                <td><span class=\"badge-compare badge-down\">\u25bc \u0e25\u0e14\u0e25\u0e07 70.57%<\/span><\/td>\r\n                            <\/tr>\r\n                                                    <tr>\r\n                                <td>2569<\/td>\r\n                                <td>\u0e1e.\u0e04.<\/td>\r\n                                <td>61<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td><span class=\"badge-compare badge-down\">\u25bc \u0e25\u0e14\u0e25\u0e07 100.00%<\/span><\/td>\r\n                            <\/tr>\r\n                                                    <tr>\r\n                                <td>2569<\/td>\r\n                                <td>\u0e21\u0e34.\u0e22.<\/td>\r\n                                <td>61<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td>-<\/td>\r\n                            <\/tr>\r\n                                                    <tr>\r\n                                <td>2569<\/td>\r\n                                <td>\u0e01.\u0e04.<\/td>\r\n                                <td>61<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td>-<\/td>\r\n                            <\/tr>\r\n                                                    <tr>\r\n                                <td>2569<\/td>\r\n                                <td>\u0e2a.\u0e04.<\/td>\r\n                                <td>61<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td>-<\/td>\r\n                            <\/tr>\r\n                                                    <tr>\r\n                                <td>2569<\/td>\r\n                                <td>\u0e01.\u0e22.<\/td>\r\n                                <td>61<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td>-<\/td>\r\n                            <\/tr>\r\n                                                    <tr>\r\n                                <td>2569<\/td>\r\n                                <td>\u0e15.\u0e04.<\/td>\r\n                                <td>61<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td>-<\/td>\r\n                            <\/tr>\r\n                                                    <tr>\r\n                                <td>2569<\/td>\r\n                                <td>\u0e1e.\u0e22.<\/td>\r\n                                <td>61<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td>-<\/td>\r\n                            <\/tr>\r\n                                                    <tr>\r\n                                <td>2569<\/td>\r\n                                <td>\u0e18.\u0e04.<\/td>\r\n                                <td>61<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td>0.00<\/td>\r\n                                <td>-<\/td>\r\n                            <\/tr>\r\n                                            <\/tbody>\r\n                    <tfoot class=\"gom-tfoot\">\r\n                        <tr>\r\n                            <td colspan=\"3\">\u0e23\u0e27\u0e21<\/td>\r\n                            <td>153.42<\/td>\r\n                            <td colspan=\"2\"><\/td>\r\n                        <\/tr>\r\n                        <tr>\r\n                            <td colspan=\"3\">\u0e40\u0e09\u0e25\u0e35\u0e48\u0e22\/\u0e40\u0e14\u0e37\u0e2d\u0e19<\/td>\r\n                            <td>38.36<\/td>\r\n                            <td>0.63<\/td>\r\n                            <td><\/td>\r\n                        <\/tr>\r\n                    <\/tfoot>\r\n                <\/table>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <script>\r\n            document.addEventListener('DOMContentLoaded', function() {\r\n                const el = document.getElementById('gomWasteChartNewUI');\r\n                if (!el || typeof Chart === 'undefined') return;\r\n                const ctx = el.getContext('2d');\r\n                const chartDataByYear = {\"2025\":[0,0,0,0,0,0,0,44.6,29.8,41,54,66.2],\"2026\":[48.4,54.8,38.8,11.42,0,0,0,0,0,0,0,0]};\r\n                const labels = [\"\u0e21.\u0e04.\",\"\u0e01.\u0e1e.\",\"\u0e21\u0e35.\u0e04.\",\"\u0e40\u0e21.\u0e22.\",\"\u0e1e.\u0e04.\",\"\u0e21\u0e34.\u0e22.\",\"\u0e01.\u0e04.\",\"\u0e2a.\u0e04.\",\"\u0e01.\u0e22.\",\"\u0e15.\u0e04.\",\"\u0e1e.\u0e22.\",\"\u0e18.\u0e04.\"];\r\n                const latestYear = 2026;\r\n\r\n                \/\/ \u0e1e\u0e32\u0e40\u0e25\u0e15\u0e15\u0e4c\u0e2a\u0e35 (\u0e25\u0e48\u0e32\u0e2a\u0e38\u0e14 = \u0e40\u0e02\u0e35\u0e22\u0e27)\r\n                const colors = {\r\n                    2: {\r\n                        border: '#f59e0b',\r\n                        point: '#f59e0b'\r\n                    },\r\n                    1: {\r\n                        border: '#3b82f6',\r\n                        point: '#3b82f6'\r\n                    },\r\n                    0: {\r\n                        border: '#16a34a',\r\n                        point: '#16a34a'\r\n                    } \/\/ \u0e1b\u0e35\u0e25\u0e48\u0e32\u0e2a\u0e38\u0e14\r\n                };\r\n\r\n                \/\/ helper \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a gradient (\u0e23\u0e2d\u0e07\u0e23\u0e31\u0e1a Chart.js v4)\r\n                const hexToRGBA = (hex, a) => {\r\n                    const n = parseInt(hex.slice(1), 16);\r\n                    const r = (n >> 16) & 255,\r\n                        g = (n >> 8) & 255,\r\n                        b = n & 255;\r\n                    return `rgba(${r},${g},${b},${a})`;\r\n                };\r\n\r\n                const datasets = [];\r\n                let idx = 0;\r\n                for (const year in chartDataByYear) {\r\n                    const isLatest = parseInt(year) === latestYear;\r\n                    const c = colors[idx] || {\r\n                        border: '#999',\r\n                        point: '#666'\r\n                    };\r\n                    const ds = {\r\n                        label: (parseInt(year) + 543).toString(),\r\n                        data: chartDataByYear[year],\r\n                        borderColor: c.border,\r\n                        pointBackgroundColor: c.point,\r\n                        borderWidth: isLatest ? 3 : 2,\r\n                        tension: 0.35,\r\n                        pointRadius: 4,\r\n                        pointHoverRadius: 6,\r\n                        fill: isLatest ? 'origin' : false\r\n                    };\r\n                    if (isLatest) {\r\n                        const h = el.clientHeight || 380;\r\n                        const grad = ctx.createLinearGradient(0, 0, 0, h);\r\n                        grad.addColorStop(0, hexToRGBA(c.border, 0.35));\r\n                        grad.addColorStop(1, hexToRGBA(c.border, 0.00));\r\n                        ds.backgroundColor = grad;\r\n                    }\r\n                    datasets.push(ds);\r\n                    idx++;\r\n                }\r\n\r\n                Chart.register(ChartDataLabels);\r\n                new Chart(ctx, {\r\n                    type: 'line',\r\n                    data: {\r\n                        labels,\r\n                        datasets\r\n                    },\r\n                    options: {\r\n                        responsive: true,\r\n                        maintainAspectRatio: false,\r\n                        interaction: {\r\n                            mode: 'index',\r\n                            intersect: false\r\n                        },\r\n                        plugins: {\r\n                            legend: {\r\n                                position: 'top',\r\n                                labels: {\r\n                                    usePointStyle: true,\r\n                                    pointStyle: 'rectRounded'\r\n                                }\r\n                            },\r\n                            tooltip: {\r\n                                mode: 'index',\r\n                                intersect: false,\r\n                                callbacks: {\r\n                                    label: (t) => t.dataset.label + ': ' + (t.parsed.y ?? 0).toLocaleString(undefined, {\r\n                                        maximumFractionDigits: 2\r\n                                    }) + ' \u0e01\u0e01.'\r\n                                }\r\n                            },\r\n                            datalabels: {\r\n                                display: (ctx) => (ctx.dataset.data[ctx.dataIndex] > 0),\r\n                                align: 'top',\r\n                                anchor: 'end',\r\n                                font: {\r\n                                    size: 11,\r\n                                    weight: 'bold'\r\n                                },\r\n                                formatter: (v) => v.toLocaleString(),\r\n                                color: '#111'\r\n                            }\r\n                        },\r\n                        scales: {\r\n                            y: {\r\n                                beginAtZero: true,\r\n                                ticks: {\r\n                                    callback: (v) => v.toLocaleString() + ' \u0e01\u0e01.'\r\n                                }\r\n                            },\r\n                            x: {\r\n                                grid: {\r\n                                    display: false\r\n                                }\r\n                            }\r\n                        }\r\n                    }\r\n                });\r\n            });\r\n        <\/script>\r\n    \n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1824","page","type-page","status-publish","hentry"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false},"uagb_author_info":{"display_name":"admin","author_link":"https:\/\/arit.pcru.ac.th\/greenoffice\/author\/admin\/"},"uagb_comment_info":0,"uagb_excerpt":null,"rttpg_featured_image_url":null,"rttpg_author":{"display_name":"admin","author_link":"https:\/\/arit.pcru.ac.th\/greenoffice\/author\/admin\/"},"rttpg_comment":0,"rttpg_category":null,"rttpg_excerpt":null,"_links":{"self":[{"href":"https:\/\/arit.pcru.ac.th\/greenoffice\/wp-json\/wp\/v2\/pages\/1824","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/arit.pcru.ac.th\/greenoffice\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/arit.pcru.ac.th\/greenoffice\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/arit.pcru.ac.th\/greenoffice\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/arit.pcru.ac.th\/greenoffice\/wp-json\/wp\/v2\/comments?post=1824"}],"version-history":[{"count":3,"href":"https:\/\/arit.pcru.ac.th\/greenoffice\/wp-json\/wp\/v2\/pages\/1824\/revisions"}],"predecessor-version":[{"id":1879,"href":"https:\/\/arit.pcru.ac.th\/greenoffice\/wp-json\/wp\/v2\/pages\/1824\/revisions\/1879"}],"wp:attachment":[{"href":"https:\/\/arit.pcru.ac.th\/greenoffice\/wp-json\/wp\/v2\/media?parent=1824"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}