crie uma visualização para esses dados, adicione análises e comentários: população 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 21.674 21.851 22.014 22.014 22.326 22.326 20.196 152.401 %R.Líquida Total por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 8,93 8,89 8,88 11,01 9,47 11,1 10,79 10,05 %Transf. Intergov. líquidas por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 74,78 75,44 73,05 79,62 84,9 81,41 81,94 79,63 %Transf. para a Saúde (SUS) por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 8,21 8,21 7,73 8,59 7,34 7,17 8,72 7,97 %Transf. União p/ Saúde por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 98,09 97,69 88,51 89,66 88 90,34 76,13 88,1 %Transf. da União p/ (SUS) por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 21,97 21,8 18,26 17,37 16,78 20,28 21,06 19,38 %R.Imp. Transf.Const.Legais por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 65,8 66,49 62,71 70,99 67,13 70,33 71,68 68,42 R$ D.Total/ Hab por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 1.163,97 1.209,20 1.463,85 1.599,51 1.607,85 2.170,75 2.699,16 1.692,64 %D.com Medicamentos por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 8,37 10,91 10,72 8,83 9,21 6,64 6,6 8,4 %D.Serv.Terc/D.Total por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 11,29 11,05 13,62 14,81 13,99 13,11 12,1 12,92 %D.Invest/D.Total por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 2,21 0,4 2,37 0,29 0,92 0,22 2,02 1,19 %Transf.SUS/D.Total por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 24,52 25,03 19,93 25,31 28,33 21,03 25,04 24,09 %R.Próprios em Saúde-EC 29 por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 24,52 25,03 19,93 25,31 28,33 21,03 25,04 24,09 R.Impostos e Transf.Const por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 62.271.564,25 67.769.665,99 68.994.168,72 91.591.953,75 109.541.191,15 122.789.229,61 136.774.828,61 659.732.602,08 R.Transf.SUS por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 6.186.511,19 6.613.437,73 6.423.676,85 8.911.340,45 10.171.118,22 10.192.929,38 13.648.832,77 62.147.846,59 R.Transf.SUS/Hab por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 285,43 302,66 291,8 404,8 455,57 456,55 675,82 407,79 D.Pessoal por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 9.871.682,54 9.708.178,13 10.689.532,45 10.148.774,49 9.928.461,07 15.267.115,47 15.912.502,37 81.526.246,52 D.R.Próprios por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 18.649.276,55 19.428.267,23 21.599.050,29 29.048.275,79 26.784.145,88 39.808.719,16 44.039.320,00 199.357.054,90 D.R.Próprios em Saúde/Hab por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 860,44 889,12 981,15 1.319,54 1.199,68 1.783,07 2.180,60 1.308,11 D.Total Saúde por Ano segundo Municípios 2018 2019 2020 2021 2022 2023 2024 Total 354000 Pompéia 25.227.830,40 26.422.132,57 32.225.098,20 35.211.569,25 35.896.816,25 48.464.273,86 54.512.292,09 257.960.012,62 - Initial Deployment
61186e8 verified | <html lang="pt-BR"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Dashboard Financeiro - Pompéia</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/chart.js"></script> | |
| <script src="https://kit.fontawesome.com/a076d05399.js" crossorigin="anonymous"></script> | |
| <style> | |
| .card-hover:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 10px 20px rgba(0,0,0,0.1); | |
| } | |
| .animate-bounce { | |
| animation: bounce 2s infinite; | |
| } | |
| @keyframes bounce { | |
| 0%, 100% { transform: translateY(0); } | |
| 50% { transform: translateY(-10px); } | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-gray-50 font-sans"> | |
| <div class="container mx-auto px-4 py-8"> | |
| <header class="mb-10"> | |
| <h1 class="text-4xl font-bold text-blue-800 text-center mb-2">Dashboard Financeiro Municipal</h1> | |
| <h2 class="text-2xl font-semibold text-gray-700 text-center">Pompéia - Análise 2018-2024</h2> | |
| <div class="flex justify-center mt-4"> | |
| <div class="bg-blue-100 text-blue-800 px-6 py-2 rounded-full shadow-md animate-bounce"> | |
| <i class="fas fa-chart-line mr-2"></i> Dados atualizados até 2024 | |
| </div> | |
| </div> | |
| </header> | |
| <!-- Population Section --> | |
| <section class="mb-12"> | |
| <div class="bg-white rounded-xl shadow-lg p-6 card-hover transition-all duration-300"> | |
| <h3 class="text-xl font-bold text-gray-800 mb-4 flex items-center"> | |
| <i class="fas fa-users mr-2 text-blue-600"></i> Evolução Populacional | |
| </h3> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-8"> | |
| <div> | |
| <canvas id="populationChart"></canvas> | |
| </div> | |
| <div class="flex flex-col justify-center"> | |
| <div class="bg-blue-50 p-4 rounded-lg mb-4"> | |
| <h4 class="font-semibold text-blue-800 mb-2">Análise Demográfica</h4> | |
| <p class="text-gray-700">A população de Pompéia apresentou crescimento constante até 2023, com queda significativa em 2024 (-9.5%).</p> | |
| </div> | |
| <div class="bg-green-50 p-4 rounded-lg"> | |
| <h4 class="font-semibold text-green-800 mb-2">Destaque</h4> | |
| <p class="text-gray-700">Entre 2018 e 2023, a cidade teve um crescimento populacional médio de 0.6% ao ano, indicando estabilidade demográfica antes da queda em 2024.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Financial Indicators Section --> | |
| <section class="mb-12"> | |
| <h3 class="text-2xl font-bold text-gray-800 mb-6 flex items-center"> | |
| <i class="fas fa-chart-pie mr-2 text-purple-600"></i> Indicadores Financeiros Chave | |
| </h3> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> | |
| <!-- Revenue Card --> | |
| <div class="bg-white rounded-xl shadow-lg p-6 card-hover transition-all duration-300"> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-green-100 p-3 rounded-full mr-4"> | |
| <i class="fas fa-money-bill-wave text-green-600 text-xl"></i> | |
| </div> | |
| <h4 class="font-bold text-gray-800">Receitas Líquidas</h4> | |
| </div> | |
| <canvas id="revenueChart" height="200"></canvas> | |
| <div class="mt-4 text-sm text-gray-600"> | |
| <p>Média do período: 10.05% do total. Pico em 2023 (11.1%) e menor valor em 2018 (8.93%).</p> | |
| </div> | |
| </div> | |
| <!-- Transfers Card --> | |
| <div class="bg-white rounded-xl shadow-lg p-6 card-hover transition-all duration-300"> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-blue-100 p-3 rounded-full mr-4"> | |
| <i class="fas fa-exchange-alt text-blue-600 text-xl"></i> | |
| </div> | |
| <h4 class="font-bold text-gray-800">Transferências Intergovernamentais</h4> | |
| </div> | |
| <canvas id="transfersChart" height="200"></canvas> | |
| <div class="mt-4 text-sm text-gray-600"> | |
| <p>Representam em média 79.63% das receitas. Crescimento de 7.16 pontos percentuais entre 2018-2024.</p> | |
| </div> | |
| </div> | |
| <!-- Health Card --> | |
| <div class="bg-white rounded-xl shadow-lg p-6 card-hover transition-all duration-300"> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-red-100 p-3 rounded-full mr-4"> | |
| <i class="fas fa-heartbeat text-red-600 text-xl"></i> | |
| </div> | |
| <h4 class="font-bold text-gray-800">Transferências para Saúde (SUS)</h4> | |
| </div> | |
| <canvas id="healthChart" height="200"></canvas> | |
| <div class="mt-4 text-sm text-gray-600"> | |
| <p>Média de 7.97%. Maior valor em 2024 (8.72%) e menor em 2023 (7.17%). Queda de 1.04 pontos entre 2018-2023.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Financial Evolution Section --> | |
| <section class="mb-12"> | |
| <div class="bg-white rounded-xl shadow-lg p-6 card-hover transition-all duration-300"> | |
| <h3 class="text-xl font-bold text-gray-800 mb-4 flex items-center"> | |
| <i class="fas fa-line-chart mr-2 text-indigo-600"></i> Evolução Financeira Detalhada | |
| </h3> | |
| <div class="grid grid-cols-1 lg:grid-cols-2 gap-8"> | |
| <div> | |
| <canvas id="financialEvolutionChart"></canvas> | |
| </div> | |
| <div> | |
| <div class="bg-yellow-50 p-4 rounded-lg mb-4"> | |
| <h4 class="font-semibold text-yellow-800 mb-2">Destaques Financeiros</h4> | |
| <ul class="list-disc pl-5 text-gray-700 space-y-2"> | |
| <li>Receita per capita aumentou 132% no período (R$1.163,97 em 2018 para R$2.699,16 em 2024)</li> | |
| <li>Investimentos representaram apenas 1.19% em média, com pico de 2.37% em 2020</li> | |
| <li>Gastos com medicamentos caíram de 8.37% (2018) para 6.6% (2024)</li> | |
| <li>Transferências da União para saúde caíram de 98.09% (2018) para 76.13% (2024)</li> | |
| </ul> | |
| </div> | |
| <div class="bg-purple-50 p-4 rounded-lg"> | |
| <h4 class="font-semibold text-purple-800 mb-2">Análise de Tendências</h4> | |
| <p class="text-gray-700">O município vem aumentando sua dependência de transferências intergovernamentais (74.78% em 2018 para 81.94% em 2024), enquanto reduz o percentual de transferências específicas para saúde.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Health Expenditure Section --> | |
| <section class="mb-12"> | |
| <div class="bg-white rounded-xl shadow-lg p-6 card-hover transition-all duration-300"> | |
| <h3 class="text-xl font-bold text-gray-800 mb-4 flex items-center"> | |
| <i class="fas fa-hospital mr-2 text-red-600"></i> Gastos com Saúde | |
| </h3> | |
| <div class="grid grid-cols-1 lg:grid-cols-2 gap-8"> | |
| <div> | |
| <canvas id="healthExpenditureChart"></canvas> | |
| </div> | |
| <div> | |
| <div class="bg-red-50 p-4 rounded-lg mb-4"> | |
| <h4 class="font-semibold text-red-800 mb-2">Investimento em Saúde</h4> | |
| <p class="text-gray-700">Os gastos totais com saúde aumentaram 116% no período (R$25.2 milhões em 2018 para R$54.5 milhões em 2024). O gasto per capita com saúde subiu de R$285,43 para R$675,82 (+137%).</p> | |
| </div> | |
| <div class="grid grid-cols-2 gap-4"> | |
| <div class="bg-green-50 p-3 rounded-lg"> | |
| <p class="text-sm font-semibold text-green-800">Melhor Ano</p> | |
| <p class="text-lg font-bold">2024</p> | |
| <p class="text-xs text-gray-600">Maior investimento per capita</p> | |
| </div> | |
| <div class="bg-blue-50 p-3 rounded-lg"> | |
| <p class="text-sm font-semibold text-blue-800">Média Período</p> | |
| <p class="text-lg font-bold">R$407,79</p> | |
| <p class="text-xs text-gray-600">Gasto saúde per capita</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Comparative Analysis Section --> | |
| <section> | |
| <div class="bg-white rounded-xl shadow-lg p-6 card-hover transition-all duration-300"> | |
| <h3 class="text-xl font-bold text-gray-800 mb-4 flex items-center"> | |
| <i class="fas fa-balance-scale mr-2 text-orange-600"></i> Análise Comparativa | |
| </h3> | |
| <div class="grid grid-cols-1 lg:grid-cols-2 gap-8"> | |
| <div> | |
| <canvas id="comparativeChart"></canvas> | |
| </div> | |
| <div> | |
| <div class="bg-orange-50 p-4 rounded-lg mb-4"> | |
| <h4 class="font-semibold text-orange-800 mb-2">Principais Observações</h4> | |
| <ul class="list-disc pl-5 text-gray-700 space-y-2"> | |
| <li>Enquanto a receita per capita aumentou 132%, os gastos com pessoal cresceram apenas 61%</li> | |
| <li>As transferências para saúde representaram em média 24.09% do total de despesas</li> | |
| <li>O município manteve uma média de 68.42% de receitas de impostos e transferências constitucionais</li> | |
| <li>Os serviços terceirizados representaram 12.92% em média, com pico de 14.81% em 2021</li> | |
| </ul> | |
| </div> | |
| <div class="bg-indigo-50 p-4 rounded-lg"> | |
| <h4 class="font-semibold text-indigo-800 mb-2">Recomendações</h4> | |
| <p class="text-gray-700">Considerando a queda populacional em 2024 e o aumento dos recursos per capita, sugere-se uma revisão da alocação de recursos, com possível aumento nos investimentos (atualmente apenas 1.19% em média) e atenção à sustentabilidade dos gastos com pessoal.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <footer class="mt-12 text-center text-gray-600 text-sm"> | |
| <p>Dashboard desenvolvido para análise dos dados financeiros de Pompéia (2018-2024)</p> | |
| <p class="mt-2">Dados atualizados em 2024 | Visualização interativa</p> | |
| </footer> | |
| </div> | |
| <script> | |
| // Population Chart | |
| const populationCtx = document.getElementById('populationChart').getContext('2d'); | |
| const populationChart = new Chart(populationCtx, { | |
| type: 'line', | |
| data: { | |
| labels: ['2018', '2019', '2020', '2021', '2022', '2023', '2024'], | |
| datasets: [{ | |
| label: 'População', | |
| data: [21674, 21851, 22014, 22014, 22326, 22326, 20196], | |
| backgroundColor: 'rgba(54, 162, 235, 0.2)', | |
| borderColor: 'rgba(54, 162, 235, 1)', | |
| borderWidth: 3, | |
| tension: 0.3, | |
| fill: true | |
| }] | |
| }, | |
| options: { | |
| responsive: true, | |
| plugins: { | |
| title: { | |
| display: true, | |
| text: 'Evolução da População (2018-2024)', | |
| font: { size: 16 } | |
| }, | |
| tooltip: { | |
| callbacks: { | |
| label: function(context) { | |
| return `${context.dataset.label}: ${context.raw.toLocaleString()}`; | |
| } | |
| } | |
| } | |
| }, | |
| scales: { | |
| y: { | |
| beginAtZero: false, | |
| title: { display: true, text: 'Habitantes' } | |
| } | |
| } | |
| } | |
| }); | |
| // Revenue Chart | |
| const revenueCtx = document.getElementById('revenueChart').getContext('2d'); | |
| const revenueChart = new Chart(revenueCtx, { | |
| type: 'bar', | |
| data: { | |
| labels: ['2018', '2019', '2020', '2021', '2022', '2023', '2024'], | |
| datasets: [{ | |
| label: '% Receita Líquida', | |
| data: [8.93, 8.89, 8.88, 11.01, 9.47, 11.1, 10.79], | |
| backgroundColor: 'rgba(75, 192, 192, 0.6)', | |
| borderColor: 'rgba(75, 192, 192, 1)', | |
| borderWidth: 1 | |
| }] | |
| }, | |
| options: { | |
| responsive: true, | |
| plugins: { | |
| legend: { display: false }, | |
| tooltip: { | |
| callbacks: { | |
| label: function(context) { | |
| return `${context.dataset.label}: ${context.raw}%`; | |
| } | |
| } | |
| } | |
| }, | |
| scales: { | |
| y: { | |
| beginAtZero: true, | |
| title: { display: true, text: 'Percentual (%)' } | |
| } | |
| } | |
| } | |
| }); | |
| // Transfers Chart | |
| const transfersCtx = document.getElementById('transfersChart').getContext('2d'); | |
| const transfersChart = new Chart(transfersCtx, { | |
| type: 'line', | |
| data: { | |
| labels: ['2018', '2019', '2020', '2021', '2022', '2023', '2024'], | |
| datasets: [{ | |
| label: '% Transferências Intergovernamentais', | |
| data: [74.78, 75.44, 73.05, 79.62, 84.9, 81.41, 81.94], | |
| backgroundColor: 'rgba(54, 162, 235, 0.2)', | |
| borderColor: 'rgba(54, 162, 235, 1)', | |
| borderWidth: 2, | |
| tension: 0.3, | |
| fill: true | |
| }] | |
| }, | |
| options: { | |
| responsive: true, | |
| plugins: { | |
| legend: { display: false }, | |
| tooltip: { | |
| callbacks: { | |
| label: function(context) { | |
| return `${context.dataset.label}: ${context.raw}%`; | |
| } | |
| } | |
| } | |
| }, | |
| scales: { | |
| y: { | |
| beginAtZero: false, | |
| title: { display: true, text: 'Percentual (%)' } | |
| } | |
| } | |
| } | |
| }); | |
| // Health Chart | |
| const healthCtx = document.getElementById('healthChart').getContext('2d'); | |
| const healthChart = new Chart(healthCtx, { | |
| type: 'bar', | |
| data: { | |
| labels: ['2018', '2019', '2020', '2021', '2022', '2023', '2024'], | |
| datasets: [{ | |
| label: '% Transferências para Saúde (SUS)', | |
| data: [8.21, 8.21, 7.73, 8.59, 7.34, 7.17, 8.72], | |
| backgroundColor: 'rgba(255, 99, 132, 0.6)', | |
| borderColor: 'rgba(255, 99, 132, 1)', | |
| borderWidth: 1 | |
| }] | |
| }, | |
| options: { | |
| responsive: true, | |
| plugins: { | |
| legend: { display: false }, | |
| tooltip: { | |
| callbacks: { | |
| label: function(context) { | |
| return `${context.dataset.label}: ${context.raw}%`; | |
| } | |
| } | |
| } | |
| }, | |
| scales: { | |
| y: { | |
| beginAtZero: true, | |
| title: { display: true, text: 'Percentual (%)' } | |
| } | |
| } | |
| } | |
| }); | |
| // Financial Evolution Chart | |
| const financialCtx = document.getElementById('financialEvolutionChart').getContext('2d'); | |
| const financialChart = new Chart(financialCtx, { | |
| type: 'line', | |
| data: { | |
| labels: ['2018', '2019', '2020', '2021', '2022', '2023', '2024'], | |
| datasets: [ | |
| { | |
| label: 'R$ Total per capita', | |
| data: [1163.97, 1209.20, 1463.85, 1599.51, 1607.85, 2170.75, 2699.16], | |
| borderColor: 'rgba(54, 162, 235, 1)', | |
| backgroundColor: 'rgba(54, 162, 235, 0.1)', | |
| borderWidth: 3, | |
| tension: 0.3, | |
| yAxisID: 'y' | |
| }, | |
| { | |
| label: '% Investimento/Total', | |
| data: [2.21, 0.4, 2.37, 0.29, 0.92, 0.22, 2.02], | |
| borderColor: 'rgba(255, 159, 64, 1)', | |
| backgroundColor: 'rgba(255, 159, 64, 0.1)', | |
| borderWidth: 2, | |
| tension: 0.3, | |
| yAxisID: 'y1' | |
| }, | |
| { | |
| label: '% Serviços Terceirizados', | |
| data: [11.29, 11.05, 13.62, 14.81, 13.99, 13.11, 12.1], | |
| borderColor: 'rgba(153, 102, 255, 1)', | |
| backgroundColor: 'rgba(153, 102, 255, 0.1)', | |
| borderWidth: 2, | |
| tension: 0.3, | |
| yAxisID: 'y1' | |
| } | |
| ] | |
| }, | |
| options: { | |
| responsive: true, | |
| interaction: { | |
| mode: 'index', | |
| intersect: false, | |
| }, | |
| plugins: { | |
| title: { | |
| display: true, | |
| text: 'Evolução Financeira Comparada', | |
| font: { size: 16 } | |
| }, | |
| tooltip: { | |
| callbacks: { | |
| label: function(context) { | |
| let label = context.dataset.label || ''; | |
| if (label) label += ': '; | |
| if (context.datasetIndex === 0) { | |
| label += 'R$' + context.raw.toFixed(2); | |
| } else { | |
| label += context.raw + '%'; | |
| } | |
| return label; | |
| } | |
| } | |
| } | |
| }, | |
| scales: { | |
| y: { | |
| type: 'linear', | |
| display: true, | |
| position: 'left', | |
| title: { display: true, text: 'Valor per capita (R$)' } | |
| }, | |
| y1: { | |
| type: 'linear', | |
| display: true, | |
| position: 'right', | |
| title: { display: true, text: 'Percentual (%)' }, | |
| grid: { drawOnChartArea: false } | |
| } | |
| } | |
| } | |
| }); | |
| // Health Expenditure Chart | |
| const healthExpenditureCtx = document.getElementById('healthExpenditureChart').getContext('2d'); | |
| const healthExpenditureChart = new Chart(healthExpenditureCtx, { | |
| type: 'bar', | |
| data: { | |
| labels: ['2018', '2019', '2020', '2021', '2022', '2023', '2024'], | |
| datasets: [ | |
| { | |
| label: 'R$ Transferências SUS per capita', | |
| data: [285.43, 302.66, 291.8, 404.8, 455.57, 456.55, 675.82], | |
| backgroundColor: 'rgba(255, 99, 132, 0.7)', | |
| borderColor: 'rgba(255, 99, 132, 1)', | |
| borderWidth: 1, | |
| yAxisID: 'y' | |
| }, | |
| { | |
| label: '% Transferências SUS/Total', | |
| data: [24.52, 25.03, 19.93, 25.31, 28.33, 21.03, 25.04], | |
| type: 'line', | |
| borderColor: 'rgba(54, 162, 235, 1)', | |
| backgroundColor: 'rgba(54, 162, 235, 0.1)', | |
| borderWidth: 3, | |
| tension: 0.3, | |
| yAxisID: 'y1' | |
| } | |
| ] | |
| }, | |
| options: { | |
| responsive: true, | |
| plugins: { | |
| title: { | |
| display: true, | |
| text: 'Investimentos em Saúde (Valor e Percentual)', | |
| font: { size: 16 } | |
| }, | |
| tooltip: { | |
| callbacks: { | |
| label: function(context) { | |
| let label = context.dataset.label || ''; | |
| if (label) label += ': '; | |
| if (context.datasetIndex === 0) { | |
| label += 'R$' + context.raw.toFixed(2); | |
| } else { | |
| label += context.raw + '%'; | |
| } | |
| return label; | |
| } | |
| } | |
| } | |
| }, | |
| scales: { | |
| y: { | |
| type: 'linear', | |
| display: true, | |
| position: 'left', | |
| title: { display: true, text: 'Valor per capita (R$)' } | |
| }, | |
| y1: { | |
| type: 'linear', | |
| display: true, | |
| position: 'right', | |
| title: { display: true, text: 'Percentual (%)' }, | |
| grid: { drawOnChartArea: false } | |
| } | |
| } | |
| } | |
| }); | |
| // Comparative Chart | |
| const comparativeCtx = document.getElementById('comparativeChart').getContext('2d'); | |
| const comparativeChart = new Chart(comparativeCtx, { | |
| type: 'bar', | |
| data: { | |
| labels: ['2018', '2019', '2020', '2021', '2022', '2023', '2024'], | |
| datasets: [ | |
| { | |
| label: 'R$ Impostos e Transf. Const.', | |
| data: [62271564.25, 67769665.99, 68994168.72, 91591953.75, 109541191.15, 122789229.61, 136774828.61], | |
| backgroundColor: 'rgba(54, 162, 235, 0.7)', | |
| borderColor: 'rgba(54, 162, 235, 1)', | |
| borderWidth: 1, | |
| yAxisID: 'y' | |
| }, | |
| { | |
| label: 'R$ Despesa com Pessoal', | |
| data: [9871682.54, 9708178.13, 10689532.45, 10148774.49, 9928461.07, 15267115.47, 15912502.37], | |
| backgroundColor: 'rgba(255, 99, 132, 0.7)', | |
| borderColor: 'rgba(255, 99, 132, 1)', | |
| borderWidth: 1, | |
| yAxisID: 'y' | |
| }, | |
| { | |
| label: 'R$ Despesas Próprias', | |
| data: [18649276.55, 19428267.23, 21599050.29, 29048275.79, 26784145.88, 39808719.16, 44039320.00], | |
| backgroundColor: 'rgba(75, 192, 192, 0.7)', | |
| borderColor: 'rgba(75, 192, 192, 1)', | |
| borderWidth: 1, | |
| yAxisID: 'y' | |
| } | |
| ] | |
| }, | |
| options: { | |
| responsive: true, | |
| plugins: { | |
| title: { | |
| display: true, | |
| text: 'Comparativo de Receitas e Despesas (R$)', | |
| font: { size: 16 } | |
| }, | |
| tooltip: { | |
| callbacks: { | |
| label: function(context) { | |
| return `${context.dataset.label}: R$${(context.raw/1000000).toFixed(2)} milhões`; | |
| } | |
| } | |
| } | |
| }, | |
| scales: { | |
| y: { | |
| beginAtZero: true, | |
| title: { display: true, text: 'Valor em R$' }, | |
| ticks: { | |
| callback: function(value) { | |
| return 'R$' + (value/1000000) + 'M'; | |
| } | |
| } | |
| } | |
| } | |
| } | |
| }); | |
| </script> | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=paulosena/siops" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |