{"id":6333,"date":"2025-08-02T23:55:50","date_gmt":"2025-08-02T21:55:50","guid":{"rendered":"https:\/\/platform.arpalcalabria.it\/site\/?page_id=6333"},"modified":"2025-08-02T23:55:50","modified_gmt":"2025-08-02T21:55:50","slug":"indicatori-istat-calabria","status":"publish","type":"page","link":"https:\/\/platform.arpalcalabria.it\/site\/indicatori-istat-calabria\/","title":{"rendered":"Dashboard Indicatori ISTAT Sintetici"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"6333\" class=\"elementor elementor-6333\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-c085caa elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"c085caa\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-26d1f08\" data-id=\"26d1f08\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-3525597 elementor-widget elementor-widget-text-editor\" data-id=\"3525597\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t        <style>\n            .istat-dashboard-container {\n                font-family: inherit;\n                max-width: 100%;\n                margin: 0 auto;\n                padding: 8px;\n                background: transparent;\n            }\n            \n            .istat-dashboard-container .header {\n                background: rgba(255, 255, 255, 0.95);\n                backdrop-filter: blur(10px);\n                border-radius: 20px;\n                padding: 30px;\n                margin-bottom: 30px;\n                box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);\n                text-align: center;\n            }\n            \n            .istat-dashboard-container .card {\n                background: rgba(255, 255, 255, 0.95);\n                backdrop-filter: blur(10px);\n                border-radius: 20px;\n                padding: 25px;\n                box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);\n                margin-bottom: 30px;\n            }\n            \n            .istat-dashboard-container .controls {\n                background: rgba(255, 255, 255, 0.98);\n                border-radius: 6px;\n                padding: 10px;\n                margin-bottom: 12px;\n                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);\n                border: 1px solid rgba(102, 126, 234, 0.1);\n            }\n            \n            \/* Layout controlli critici inline *\/\n            .istat-dashboard-container .indicator-select-row {\n                margin-bottom: 8px;\n                padding-bottom: 8px;\n                border-bottom: 1px solid rgba(0, 0, 0, 0.05);\n            }\n            \n            .istat-dashboard-container .other-controls-row {\n                display: grid !important;\n                grid-template-columns: 180px 180px 1fr auto !important;\n                gap: 10px !important;\n                align-items: end !important;\n                width: 100% !important;\n            }\n            \n            .istat-dashboard-container .indicator-controls {\n                display: flex;\n                gap: 12px;\n                align-items: end;\n            }\n            \n            .istat-dashboard-container .indicator-controls select {\n                flex: 1;\n                min-width: 0;\n            }\n            \n            .istat-dashboard-container .other-controls-row .control-group:last-child {\n                display: flex;\n                align-items: end;\n            }\n            \n            .istat-dashboard-container .other-controls-row .control-group:last-child .btn {\n                white-space: nowrap;\n                min-width: 140px;\n            }\n            \n            \/* Responsive critici inline *\/\n            @media (max-width: 768px) {\n                .istat-dashboard-container {\n                    padding: 10px;\n                }\n                \n                .istat-dashboard-container .header {\n                    padding: 20px;\n                }\n                \n                .istat-dashboard-container .card {\n                    padding: 20px;\n                }\n                \n                .istat-dashboard-container .other-controls-row {\n                    grid-template-columns: 100px 100px 1fr auto !important;\n                    gap: 8px;\n                }\n                \n                .istat-dashboard-container .other-controls-row .control-group:last-child {\n                    grid-column: 1 \/ -1;\n                    justify-content: center;\n                }\n                \n                .istat-dashboard-container .indicator-controls {\n                    flex-direction: column;\n                    gap: 10px;\n                }\n            }\n            \n            @media (max-width: 480px) {\n                .istat-dashboard-container .other-controls-row {\n                    grid-template-columns: 1fr;\n                    gap: 10px;\n                }\n                \n                .istat-dashboard-container .btn-info {\n                    width: 100%;\n                    justify-content: center;\n                    margin-top: 8px;\n                }\n            }\n        <\/style>\n        \n        <div class=\"istat-dashboard-container\" data-theme=\"light\">\n            <div class=\"header\">\n                <p>Sintesi dei dati statistici territoriali per l&#8217;Italia e le regioni &#8211; Fonte dati: <a href=\"https:\/\/www.istat.it\/sistema-informativo-6\/banca-dati-territoriale-per-le-politiche-di-sviluppo\/\" target=\"_blank\">Banca Dati Territoriale per le Politiche di Sviluppo<\/a><\/p>\n            <\/div>\n\n                        <div class=\"controls\">\n                <!-- Prima riga: Selezione indicatore con pulsante Info -->\n                <div class=\"indicator-select-row\">\n                    <div class=\"control-group\">\n                        <label for=\"indicator-select\"><i class=\"fas fa-filter\"><\/i> Seleziona Indicatore<\/label>\n                        <div class=\"indicator-controls\">\n                            <select id=\"indicator-select\" autocomplete=\"off\">\n                                <option value=\"\">Scegli un indicatore&#8230;<\/option>\n                            <\/select>\n                            <button class=\"btn-info\" id=\"info-button\" onclick=\"showIndicatorInfo()\" title=\"Informazioni sull'indicatore\" disabled>\n                                <i class=\"fas fa-info-circle\"><\/i> Info\n                            <\/button>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                \n                <!-- Seconda riga: Tutti i controlli + Territori -->\n                <div class=\"other-controls-row\">\n                    <div class=\"control-group\">\n                        <label for=\"chart-type\"><i class=\"fas fa-chart-bar\"><\/i> Tipo di Grafico<\/label>\n                        <select id=\"chart-type\" autocomplete=\"off\">\n                            <option value=\"line\">Grafico a Linee<\/option>\n                            <option value=\"bar\">Grafico a Barre<\/option>\n                            <option value=\"radar\">Grafico Radar<\/option>\n                            <option value=\"pie\">Grafico a Torta<\/option>\n                            <option value=\"doughnut\">Grafico a Ciambella<\/option>\n                        <\/select>\n                    <\/div>\n                    <div class=\"control-group\">\n                        <label for=\"year-range\"><i class=\"fas fa-calendar\"><\/i> Range Anni<\/label>\n                        <select id=\"year-range\" autocomplete=\"off\">\n                            <option value=\"all\">Tutti gli anni<\/option>\n                            <option value=\"last5\">Ultimi 5 anni<\/option>\n                            <option value=\"last3\">Ultimi 3 anni<\/option>\n                        <\/select>\n                    <\/div>\n                    <div class=\"territory-filter\" id=\"territory-filter\">\n                        <!-- Territori checkbox verranno aggiunti dinamicamente -->\n                    <\/div>\n                    <div class=\"control-group\">\n                        <button class=\"btn\" onclick=\"exportData()\">\n                            <i class=\"fas fa-download\"><\/i> Esporta Dati\n                        <\/button>\n                    <\/div>\n                <\/div>\n            <\/div>\n            \n            <div class=\"dashboard\">\n                <div class=\"card full-width\">\n                    <h3><i class=\"fas fa-chart-area\"><\/i> Andamento Temporale<\/h3>\n                    <div id=\"loading-chart\" class=\"loading\" style=\"display: none;\">\n                        <i class=\"fas fa-spinner\"><\/i>\n                        <p>Caricamento grafico&#8230;<\/p>\n                    <\/div>\n                    <div id=\"no-data-chart\" class=\"no-data\" style=\"display: none;\">\n                        <i class=\"fas fa-chart-line\"><\/i>\n                        <p>Seleziona un indicatore per visualizzare i dati<\/p>\n                    <\/div>\n                    <div class=\"chart-container\">\n                        <canvas id=\"indicator-chart\"><\/canvas>\n                    <\/div>\n                <\/div>\n\n                <div class=\"card full-width\">\n                    <h3><i class=\"fas fa-table\"><\/i> Dati Tabellari<\/h3>\n                    <div id=\"loading-table\" class=\"loading\" style=\"display: none;\">\n                        <i class=\"fas fa-spinner\"><\/i>\n                        <p>Caricamento tabella&#8230;<\/p>\n                    <\/div>\n                    <div id=\"no-data-table\" class=\"no-data\" style=\"display: none;\">\n                        <i class=\"fas fa-table\"><\/i>\n                        <p>Seleziona un indicatore per visualizzare i dati<\/p>\n                    <\/div>\n                    <div id=\"table-container\"><\/div>\n                <\/div>\n\n                                <div class=\"card full-width\">\n                    <h3><i class=\"fas fa-info-circle\"><\/i> Statistiche<\/h3>\n                    <div id=\"loading-stats\" class=\"loading\" style=\"display: none;\">\n                        <i class=\"fas fa-spinner\"><\/i>\n                        <p>Calcolo statistiche&#8230;<\/p>\n                    <\/div>\n                    <div id=\"no-data-stats\" class=\"no-data\" style=\"display: none;\">\n                        <i class=\"fas fa-calculator\"><\/i>\n                        <p>Seleziona un indicatore per visualizzare le statistiche<\/p>\n                    <\/div>\n                    <div id=\"stats-container\"><\/div>\n                <\/div>\n                            <\/div>\n\n            <div class=\"footer\">\n                <p>Dashboard Indicatori ISTAT &#8211; Analisi dati statistici territoriali<\/p>\n                <p>Fonte dati: ISTAT &#8211; Istituto Nazionale di Statistica<\/p>\n            <\/div>\n        <\/div>\n        \n        <!-- Modal per informazioni indicatore -->\n        <div id=\"indicator-info-modal\" class=\"modal\" style=\"display: none;\">\n            <div class=\"modal-content\">\n                <div class=\"modal-header\">\n                    <h3><i class=\"fas fa-info-circle\"><\/i> Informazioni Indicatore<\/h3>\n                    <button class=\"modal-close\" onclick=\"closeIndicatorInfo()\">\n                        <i class=\"fas fa-times\"><\/i>\n                    <\/button>\n                <\/div>\n                <div class=\"modal-body\" id=\"modal-body-content\">\n                    <!-- Contenuto dinamico -->\n                <\/div>\n                <div class=\"modal-footer\">\n                    <button class=\"btn\" onclick=\"closeIndicatorInfo()\">\n                        <i class=\"fas fa-check\"><\/i> Chiudi\n                    <\/button>\n                <\/div>\n            <\/div>\n        <\/div>\n        \n        <!-- Modal per informazioni indicatore -->\n        <div id=\"indicator-info-modal\" class=\"modal\" style=\"display: none;\">\n            <div class=\"modal-content\">\n                <div class=\"modal-header\">\n                    <h3><i class=\"fas fa-info-circle\"><\/i> Informazioni Indicatore<\/h3>\n                    <button class=\"modal-close\" onclick=\"closeIndicatorInfo()\">\n                        <i class=\"fas fa-times\"><\/i>\n                    <\/button>\n                <\/div>\n                <div class=\"modal-body\" id=\"modal-body-content\">\n                    <!-- Contenuto dinamico -->\n                <\/div>\n                <div class=\"modal-footer\">\n                    <button class=\"btn\" onclick=\"closeIndicatorInfo()\">\n                        <i class=\"fas fa-check\"><\/i> Chiudi\n                    <\/button>\n                <\/div>\n            <\/div>\n        <\/div>\n        \n        \t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-fullwidth.php","meta":{"footnotes":""},"categories":[],"class_list":["post-6333","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/platform.arpalcalabria.it\/site\/wp-json\/wp\/v2\/pages\/6333","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/platform.arpalcalabria.it\/site\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/platform.arpalcalabria.it\/site\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/platform.arpalcalabria.it\/site\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/platform.arpalcalabria.it\/site\/wp-json\/wp\/v2\/comments?post=6333"}],"version-history":[{"count":0,"href":"https:\/\/platform.arpalcalabria.it\/site\/wp-json\/wp\/v2\/pages\/6333\/revisions"}],"wp:attachment":[{"href":"https:\/\/platform.arpalcalabria.it\/site\/wp-json\/wp\/v2\/media?parent=6333"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/platform.arpalcalabria.it\/site\/wp-json\/wp\/v2\/categories?post=6333"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}