mortalidade / index.html
paulosena's picture
crie uma visualização para esses dados: Capítulo CID-10 2018 2019 2020 2021 2022 2023 Total I. Algumas doenças infecciosas e parasitárias 9 5 8 54 15 13 104 II. Neoplasias (tumores) 29 30 36 25 32 35 187 III. Doenças sangue órgãos hemat e transt imunitár - 1 1 1 - - 3 IV. Doenças endócrinas nutricionais e metabólicas 10 5 12 18 12 9 66 V. Transtornos mentais e comportamentais 1 2 - - 2 - 5 VI. Doenças do sistema nervoso 3 8 5 6 7 7 36 IX. Doenças do aparelho circulatório 50 35 55 36 39 45 260 X. Doenças do aparelho respiratório 21 37 23 22 17 31 151 XI. Doenças do aparelho digestivo 9 11 10 15 17 20 82 XII. Doenças da pele e do tecido subcutâneo 1 1 1 1 1 2 7 XIII.Doenças sist osteomuscular e tec conjuntivo - - 3 - - 2 5 XIV. Doenças do aparelho geniturinário 5 5 5 4 2 9 30 XV. Gravidez parto e puerpério - - - 1 - - 1 XVI. Algumas afec originadas no período perinatal 1 4 - 2 1 - 8 XVII.Malf cong deformid e anomalias cromossômicas 1 - - 1 - - 2 XVIII.Sint sinais e achad anorm ex clín e laborat 6 9 - 8 8 19 50 XX. Causas externas de morbidade e mortalidade 9 10 8 17 8 12 64 Total 155 163 167 211 161 204 1061 Fonte: MS/SVS/CGIAE - Sistema de Informações sobre Mortalidade - SIM Período:2018-2023 Causa mal definidas 2018 2019 2020 2021 2022 2023 Total Sint sinais e achad anorm,exc morte súbita infânci 6 9 - 8 8 19 50 Doenças do aparelho circulatório, mal definidas 2 2 10 1 3 7 25 Doenças do aparelho respiratório, mal definidas - 3 5 2 2 2 14 Total 8 14 15 11 13 28 89 Fonte: MS/SVS/CGIAE - Sistema de Informações sobre Mortalidade - SIM Faixa Etária 2018 2019 2020 2021 2022 2023 Total Menor 1 ano 2 4 - 3 1 1 11 1 a 4 anos 1 - 2 - - 1 4 5 a 9 anos - - - 2 - - 2 10 a 14 anos - - - - - 1 1 15 a 19 anos - - - 3 - 1 4 20 a 29 anos 3 3 3 1 - 1 11 30 a 39 anos 3 4 4 13 2 8 34 40 a 49 anos 6 7 9 19 7 8 56 50 a 59 anos 14 21 14 20 17 16 102 60 a 69 anos 29 36 27 35 34 42 203 70 a 79 anos 39 29 48 51 53 47 267 80 anos e mais 58 59 60 64 47 78 366 Total 155 163 167 211 161 204 1061 Fonte: MS/SVS/CGIAE - Sistema de Informações sobre Mortalidade - SIM Local ocorrência 2018 2019 2020 2021 2022 2023 Total Hospital 121 127 155 198 153 196 950 Outro estabelecimento de saúde 1 - 1 4 2 - 8 Domicílio 27 32 7 6 4 3 79 Via pública 4 4 2 1 1 2 14 Outros 2 - 2 2 1 2 9 Ignorado - - - - - 1 1 Total 155 163 167 211 161 204 1061 Fonte: MS/SVS/CGIAE - Sistema de Informações sobre Mortalidade - SIM Fx.Etária Menor 1A 2018 2019 2021 2022 2023 Total 0 a 6 dias 1 3 2 1 - 7 7 a 27 dias - 1 1 - - 2 28 a 364 dias 1 - - - 1 2 Total 2 4 3 1 1 11 Fonte: MS/SVS/CGIAE - Sistema de Informações sobre Mortalidade - SIM Fx.Etária Menor 1A 2018 2019 2021 2022 2023 Total Taxa de mortalidade infantil 8,58 17,86 13,57 4,98 4,72 8,47 Fonte: MS/SVS/CGIAE - Sistema de Informações sobre Mortalidade - SIM obitos em mulheres em idade fértil e óbitos maternos Óbitos mulheres idade fértil por Capítulo CID-10 e Ano do Óbito Município: 354000 POMPEIA Período:2018-2023 Capítulo CID-10 2018 2019 2020 2021 2022 2023 Total I. Algumas doenças infecciosas e parasitárias - 1 - 8 - - 9 II. Neoplasias (tumores) 3 2 1 - - 3 9 IV. Doenças endócrinas nutricionais e metabólicas - 1 - - - - 1 VI. Doenças do sistema nervoso - - - 1 - - 1 IX. Doenças do aparelho circulatório 1 - 1 1 1 3 7 X. Doenças do aparelho respiratório - 1 - - - - 1 XI. Doenças do aparelho digestivo - - - 1 1 1 3 XII. Doenças da pele e do tecido subcutâneo - - - 1 - - 1 XIII.Doenças sist osteomuscular e tec conjuntivo - - 1 - - - 1 XIV. Doenças do aparelho geniturinário 1 - - - 1 1 3 XV. Gravidez parto e puerpério - - - 1 - - 1 XVIII.Sint sinais e achad anorm ex clín e laborat - - - 1 - - 1 XX. Causas externas de morbidade e mortalidade 1 - 1 3 - 1 6 Total 6 5 4 17 3 9 44 Fonte: MS/SVS/CGIAE - Sistema de Informações sobre Mortalidade - SIM obitos maternos Óbitos de mulheres em idade fértil e óbitos maternos - São Paulo Óbitos maternos por Capítulo CID-10 e Ano do Óbito Município: 354000 POMPEIA Período:2018-2023 Capítulo CID-10 2021 Total XV. Gravidez parto e puerpério 1 1 Total 1 1 Fonte: MS/SVS/CGIAE - Sistema de Informações sobre Mortalidade - SIM Óbitos por causas evitáveis em menores de 5 anos - São Paulo Óbitos p/Residênc por Capítulo CID-10 e Ano do Óbito Município: 354000 POMPEIA Período:2018-2023 Capítulo CID-10 2018 2019 2020 2021 2022 2023 Total II. Neoplasias (tumores) - - 1 - - - 1 X. Doenças do aparelho respiratório 1 - - - - - 1 XVI. Algumas afec originadas no período perinatal 1 4 - 2 1 - 8 XVII.Malf cong deformid e anomalias cromossômicas - - - 1 - - 1 XVIII.Sint sinais e achad anorm ex clín e laborat 1 - - - - 1 2 XX. Causas externas de morbidade e mortalidade - - 1 - - 1 2 Total 3 4 2 3 1 2 15 Fonte: MS/SVS/CGIAE - Sistema de Informações sobre Mortalidade - SIM Óbitos por causas evitáveis de 5 a 74 anos - São Paulo Óbitos p/Residênc por Causas evitáveis e Ano do Óbito Município: 354000 POMPEIA Período:2019-2023 Causas evitáveis 2019 2020 2021 2022 2023 Total 1. Causas evitáveis 57 50 56 50 58 271 1.2. Reduz ações prom prev contr atenç doenç infec 12 5 5 10 12 44 .. Tuberculose respirat c/confirm bacter e histol - - - - 1 1 .. Doenças infecciosas intestinais - - - - 1 1 .. Doenças pelo vírus da imunodeficiência humana 1 - - - - 1 .. Outras infecções 1 - - 5 - 6 .. Infecções respirat incl pneumonia e influenza 7 4 4 5 6 26 .. Infecções da pele e do tecido subcutâneo - 1 1 - 1 3 .. Outras doenças de notificação compulsória 2 - - - 1 3 .. Infecção do trato urinário localiz não especif 1 - - - 2 3 1.3. Reduz ações prom prev contr atenç doe ñ trans 37 40 41 34 38 190 .. Neopl malig lábio melanoma malig pele outr pele - - 1 1 - 2 .. Neopl malig fígado vias biliares intra-hepátic 1 1 1 1 1 5 .. Neoplasia maligna do estômago - 2 1 - 1 4 .. Neopl malig cólon junção retossigmoid reto ânus 1 1 1 2 2 7 .. Neoplasia maligna boca faringe e laringe 1 - - 2 2 5 .. Neoplasia maligna do esôfago 2 1 - 1 1 5 .. Neoplasia maligna traqueia brônquios pulmões 4 7 4 - 3 18 .. Neoplasia maligna da mama 1 - - 2 2 5 .. Leucemia linfoide 1 - - - - 1 .. Leucemia mieloide - - - 2 1 3 .. Diabetes mellitus 2 5 8 - 2 17 .. Obesidade 1 1 3 1 - 6 .. Psicose alcoólica e outr transtornos do álcool 2 - 4 4 3 13 .. Epilepsia e estado de mal epiléptico 1 - - - - 1 .. Doenças hipertensivas exceto hipert secundária 1 1 3 1 - 6 .. Doenças isquêmicas do coração 5 6 6 6 4 27 .. Insuficiência cardíaca 4 6 - 1 3 14 .. Doenças cerebrovasculares 5 8 5 7 9 34 .. Doenças crônicas vias aéreas infer e edema pulm 4 - 2 2 1 9 .. Doenças pulmonares devidas a agentes externos - - - - 1 1 .. Hérnias íleo paralítico e obstr intest s/hérnia - - 1 1 1 3 .. Transtornos da vesícula biliar e vias biliares - - - - 1 1 .. Insuficiência renal crônica 1 1 1 - - 3 1.4. Reduz ações prev contr atenção causas matern - - 1 - - 1 .. Complicações gravidez parto e puerpério - - 1 - - 1 1.5. Reduz ações prom prev atenç causas externas 8 5 9 6 8 36 .. Acidentes de transporte 4 4 - 2 3 13 .. Quedas - 1 - 1 - 2 .. Lesões autoprovocadas intencionalmente 1 - 3 2 - 6 .. Agressões 2 - 3 - 1 6 .. Intervenções legais e operacões de guerra - - - - 2 2 .. Exposição a forças mecânicas inanimadas 1 - - - 1 2 .. Outros riscos acidentais à respiração - - 1 1 1 3 .. Exposição acid outros fatores e aos não especif - - 1 - - 1 .. Eventos cuja intenção é indeterminada - - 1 - - 1 2. Causas mal definidas 5 - 3 5 9 22 3. Demais causas (não claramente evitáveis) 29 28 60 29 27 173 Total 91 78 119 84 94 466 Fonte: MS/SVS/CGIAE - Sistema de Informações sobre Mortalidade - SIM - Initial Deployment
b69fc2a verified
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dashboard de Mortalidade - Pompeia (2018-2023)</title>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<style>
.chart-container {
position: relative;
height: 300px;
width: 100%;
}
.fade-in {
animation: fadeIn 0.5s ease-in-out;
}
@keyframes fadeIn {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
.tab-content {
display: none;
}
.tab-content.active {
display: block;
}
.data-table {
width: 100%;
overflow-x: auto;
}
.data-table th {
background-color: #f3f4f6;
position: sticky;
top: 0;
}
</style>
</head>
<body class="bg-gray-50">
<div class="container mx-auto px-4 py-8">
<header class="mb-8">
<h1 class="text-3xl font-bold text-gray-800 flex items-center">
<i class="fas fa-chart-line text-blue-500 mr-3"></i>
Dashboard de Mortalidade - Pompeia/SP
</h1>
<p class="text-gray-600 mt-2">Período: 2018-2023 | Fonte: MS/SVS/CGIAE - Sistema de Informações sobre Mortalidade (SIM)</p>
</header>
<div class="bg-white rounded-lg shadow-md p-6 mb-8 fade-in">
<div class="flex flex-wrap justify-between items-center mb-6">
<h2 class="text-xl font-semibold text-gray-800">
<i class="fas fa-info-circle text-blue-500 mr-2"></i>
Resumo Geral
</h2>
<div class="flex space-x-2">
<span class="px-3 py-1 bg-blue-100 text-blue-800 rounded-full text-sm font-medium">Total: 1.061 óbitos</span>
<span class="px-3 py-1 bg-green-100 text-green-800 rounded-full text-sm font-medium">2018-2023</span>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-6">
<div class="bg-blue-50 p-4 rounded-lg border border-blue-100">
<div class="flex justify-between items-start">
<div>
<p class="text-sm text-blue-600 font-medium">Média Anual</p>
<p class="text-2xl font-bold text-blue-800">177</p>
</div>
<i class="fas fa-calendar-alt text-blue-400 text-xl"></i>
</div>
<div class="mt-2 text-xs text-blue-500">óbitos por ano</div>
</div>
<div class="bg-purple-50 p-4 rounded-lg border border-purple-100">
<div class="flex justify-between items-start">
<div>
<p class="text-sm text-purple-600 font-medium">Principal Causa</p>
<p class="text-lg font-bold text-purple-800 truncate">Aparelho Circulatório</p>
</div>
<i class="fas fa-heartbeat text-purple-400 text-xl"></i>
</div>
<div class="mt-2 text-xs text-purple-500">260 óbitos (24.5%)</div>
</div>
<div class="bg-red-50 p-4 rounded-lg border border-red-100">
<div class="flex justify-between items-start">
<div>
<p class="text-sm text-red-600 font-medium">Faixa Etária Mais Afetada</p>
<p class="text-lg font-bold text-red-800">80+ anos</p>
</div>
<i class="fas fa-user-tie text-red-400 text-xl"></i>
</div>
<div class="mt-2 text-xs text-red-500">366 óbitos (34.5%)</div>
</div>
<div class="bg-green-50 p-4 rounded-lg border border-green-100">
<div class="flex justify-between items-start">
<div>
<p class="text-sm text-green-600 font-medium">Local Mais Comum</p>
<p class="text-lg font-bold text-green-800">Hospital</p>
</div>
<i class="fas fa-hospital text-green-400 text-xl"></i>
</div>
<div class="mt-2 text-xs text-green-500">950 óbitos (89.5%)</div>
</div>
</div>
<div class="chart-container">
<canvas id="annualTrendChart"></canvas>
</div>
</div>
<div class="bg-white rounded-lg shadow-md p-6 mb-8 fade-in">
<div class="flex flex-wrap justify-between items-center mb-6">
<h2 class="text-xl font-semibold text-gray-800">
<i class="fas fa-filter text-blue-500 mr-2"></i>
Filtros e Visualizações
</h2>
<div class="flex space-x-2">
<button onclick="toggleTab('causes')" class="px-4 py-2 bg-blue-500 text-white rounded-md text-sm font-medium active-tab">
Por Causas
</button>
<button onclick="toggleTab('age')" class="px-4 py-2 bg-gray-200 text-gray-700 rounded-md text-sm font-medium">
Por Idade
</button>
<button onclick="toggleTab('location')" class="px-4 py-2 bg-gray-200 text-gray-700 rounded-md text-sm font-medium">
Por Local
</button>
<button onclick="toggleTab('special')" class="px-4 py-2 bg-gray-200 text-gray-700 rounded-md text-sm font-medium">
Grupos Especiais
</button>
</div>
</div>
<div id="causes" class="tab-content active">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
<div class="chart-container">
<canvas id="causeDistributionChart"></canvas>
</div>
<div class="chart-container">
<canvas id="causeTrendChart"></canvas>
</div>
</div>
<div class="mt-6 overflow-x-auto">
<table class="data-table min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Capítulo CID-10</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2018</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2019</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2020</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2021</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2022</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2023</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Total</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
<tr>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">I. Doenças infecciosas</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">9</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">5</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">8</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">54</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">15</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">13</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">104</td>
</tr>
<tr class="bg-gray-50">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">II. Neoplasias</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">29</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">30</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">36</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">25</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">32</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">35</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">187</td>
</tr>
<tr>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">IX. Aparelho circulatório</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">50</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">35</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">55</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">36</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">39</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">45</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">260</td>
</tr>
<tr class="bg-gray-50">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">X. Aparelho respiratório</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">21</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">37</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">23</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">22</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">17</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">31</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">151</td>
</tr>
<tr>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">XI. Aparelho digestivo</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">9</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">11</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">10</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">15</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">17</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">20</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">82</td>
</tr>
</tbody>
</table>
</div>
</div>
<div id="age" class="tab-content">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
<div class="chart-container">
<canvas id="ageDistributionChart"></canvas>
</div>
<div class="chart-container">
<canvas id="ageTrendChart"></canvas>
</div>
</div>
<div class="mt-6 overflow-x-auto">
<table class="data-table min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Faixa Etária</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2018</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2019</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2020</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2021</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2022</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2023</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Total</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
<tr>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">Menor 1 ano</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">2</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">4</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">-</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">3</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">1</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">1</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">11</td>
</tr>
<tr class="bg-gray-50">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">1 a 4 anos</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">1</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">-</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">2</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">-</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">-</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">1</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">4</td>
</tr>
<tr>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">30 a 39 anos</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">3</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">4</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">4</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">13</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">2</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">8</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">34</td>
</tr>
<tr class="bg-gray-50">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">60 a 69 anos</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">29</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">36</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">27</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">35</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">34</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">42</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">203</td>
</tr>
<tr>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">80+ anos</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">58</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">59</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">60</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">64</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">47</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">78</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">366</td>
</tr>
</tbody>
</table>
</div>
</div>
<div id="location" class="tab-content">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
<div class="chart-container">
<canvas id="locationDistributionChart"></canvas>
</div>
<div class="chart-container">
<canvas id="locationTrendChart"></canvas>
</div>
</div>
<div class="mt-6 overflow-x-auto">
<table class="data-table min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Local de Ocorrência</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2018</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2019</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2020</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2021</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2022</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">2023</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Total</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
<tr>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">Hospital</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">121</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">127</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">155</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">198</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">153</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">196</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">950</td>
</tr>
<tr class="bg-gray-50">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">Domicílio</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">27</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">32</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">7</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">6</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">4</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">3</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">79</td>
</tr>
<tr>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">Via pública</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">4</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">4</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">2</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">1</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">1</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">2</td>
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">14</td>
</tr>
</tbody>
</table>
</div>
</div>
<div id="special" class="tab-content">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
<div class="chart-container">
<canvas id="womenChart"></canvas>
</div>
<div class="chart-container">
<canvas id="childrenChart"></canvas>
</div>
</div>
<div class="mt-6 grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="bg-white p-4 rounded-lg border border-gray-200 shadow-sm">
<h3 class="text-lg font-medium text-gray-900 mb-4">
<i class="fas fa-female text-pink-500 mr-2"></i>
Óbitos em Mulheres em Idade Fértil (15-49 anos)
</h3>
<div class="space-y-3">
<div>
<div class="flex justify-between mb-1">
<span class="text-sm font-medium text-gray-700">Total (2018-2023)</span>
<span class="text-sm font-medium text-gray-900">44</span>
</div>
<div class="w-full bg-gray-200 rounded-full h-2">
<div class="bg-pink-500 h-2 rounded-full" style="width: 100%"></div>
</div>
</div>
<div>
<div class="flex justify-between mb-1">
<span class="text-sm font-medium text-gray-700">Principais causas</span>
<span class="text-sm font-medium text-gray-900">Neoplasias (9), Ap. Circulatório (7)</span>
</div>
</div>
</div>
</div>
<div class="bg-white p-4 rounded-lg border border-gray-200 shadow-sm">
<h3 class="text-lg font-medium text-gray-900 mb-4">
<i class="fas fa-baby text-blue-300 mr-2"></i>
Óbitos em Menores de 5 Anos
</h3>
<div class="space-y-3">
<div>
<div class="flex justify-between mb-1">
<span class="text-sm font-medium text-gray-700">Total (2018-2023)</span>
<span class="text-sm font-medium text-gray-900">15</span>
</div>
<div class="w-full bg-gray-200 rounded-full h-2">
<div class="bg-blue-300 h-2 rounded-full" style="width: 100%"></div>
</div>
</div>
<div>
<div class="flex justify-between mb-1">
<span class="text-sm font-medium text-gray-700">Principais causas</span>
<span class="text-sm font-medium text-gray-900">Período perinatal (8), Malformações (1)</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="bg-white rounded-lg shadow-md p-6 mb-8 fade-in">
<h2 class="text-xl font-semibold text-gray-800 mb-6">
<i class="fas fa-exclamation-triangle text-yellow-500 mr-2"></i>
Óbitos por Causas Evitáveis (2019-2023)
</h2>
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6 mb-6">
<div class="bg-yellow-50 p-4 rounded-lg border border-yellow-100">
<div class="flex justify-between items-start">
<div>
<p class="text-sm text-yellow-700 font-medium">Total de óbitos evitáveis</p>
<p class="text-2xl font-bold text-yellow-800">271</p>
</div>
<i class="fas fa-procedures text-yellow-500 text-xl"></i>
</div>
<div class="mt-2 text-xs text-yellow-600">56.3% de todos os óbitos no período</div>
</div>
<div class="bg-red-50 p-4 rounded-lg border border-red-100">
<div class="flex justify-between items-start">
<div>
<p class="text-sm text-red-700 font-medium">Doenças infecciosas</p>
<p class="text-2xl font-bold text-red-800">44</p>
</div>
<i class="fas fa-virus text-red-500 text-xl"></i>
</div>
<div class="mt-2 text-xs text-red-600">16.2% dos evitáveis</div>
</div>
<div class="bg-green-50 p-4 rounded-lg border border-green-100">
<div class="flex justify-between items-start">
<div>
<p class="text-sm text-green-700 font-medium">Causas externas</p>
<p class="text-2xl font-bold text-green-800">36</p>
</div>
<i class="fas fa-car-crash text-green-500 text-xl"></i>
</div>
<div class="mt-2 text-xs text-green-600">13.3% dos evitáveis</div>
</div>
</div>
<div class="chart-container">
<canvas id="avoidableChart"></canvas>
</div>
</div>
<footer class="text-center text-gray-500 text-sm mt-12">
<p>Dados fornecidos por MS/SVS/CGIAE - Sistema de Informações sobre Mortalidade (SIM)</p>
<p class="mt-1">Município: Pompeia/SP | Período: 2018-2023 | Última atualização: Junho/2023</p>
</footer>
</div>
<script>
// Tab functionality
function toggleTab(tabId) {
// Hide all tab contents
document.querySelectorAll('.tab-content').forEach(tab => {
tab.classList.remove('active');
});
// Show selected tab content
document.getElementById(tabId).classList.add('active');
// Update tab button styles
document.querySelectorAll('[onclick^="toggleTab"]').forEach(btn => {
if (btn.textContent.trim().toLowerCase().includes(tabId)) {
btn.classList.remove('bg-gray-200', 'text-gray-700');
btn.classList.add('bg-blue-500', 'text-white');
} else {
btn.classList.remove('bg-blue-500', 'text-white');
btn.classList.add('bg-gray-200', 'text-gray-700');
}
});
}
// Annual Trend Chart
const annualTrendCtx = document.getElementById('annualTrendChart').getContext('2d');
const annualTrendChart = new Chart(annualTrendCtx, {
type: 'line',
data: {
labels: ['2018', '2019', '2020', '2021', '2022', '2023'],
datasets: [{
label: 'Total de Óbitos',
data: [155, 163, 167, 211, 161, 204],
borderColor: 'rgb(59, 130, 246)',
backgroundColor: 'rgba(59, 130, 246, 0.1)',
borderWidth: 2,
fill: true,
tension: 0.4
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
title: {
display: true,
text: 'Evolução Anual do Número de Óbitos (2018-2023)',
font: {
size: 14
}
},
tooltip: {
mode: 'index',
intersect: false
}
},
scales: {
y: {
beginAtZero: true,
title: {
display: true,
text: 'Número de Óbitos'
}
}
}
}
});
// Cause Distribution Chart
const causeDistributionCtx = document.getElementById('causeDistributionChart').getContext('2d');
const causeDistributionChart = new Chart(causeDistributionCtx, {
type: 'doughnut',
data: {
labels: [
'Aparelho circulatório',
'Neoplasias',
'Aparelho respiratório',
'Doenças infecciosas',
'Aparelho digestivo',
'Outras'
],
datasets: [{
data: [260, 187, 151, 104, 82, 277],
backgroundColor: [
'rgba(239, 68, 68, 0.7)',
'rgba(139, 92, 246, 0.7)',
'rgba(16, 185, 129, 0.7)',
'rgba(59, 130, 246, 0.7)',
'rgba(245, 158, 11, 0.7)',
'rgba(156, 163, 175, 0.7)'
],
borderColor: [
'rgba(239, 68, 68, 1)',
'rgba(139, 92, 246, 1)',
'rgba(16, 185, 129, 1)',
'rgba(59, 130, 246, 1)',
'rgba(245, 158, 11, 1)',
'rgba(156, 163, 175, 1)'
],
borderWidth: 1
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
title: {
display: true,
text: 'Distribuição por Causas (2018-2023)',
font: {
size: 14
}
},
legend: {
position: 'right',
},
tooltip: {
callbacks: {
label: function(context) {
const label = context.label || '';
const value = context.raw || 0;
const total = context.dataset.data.reduce((a, b) => a + b, 0);
const percentage = Math.round((value / total) * 100);
return `${label}: ${value} (${percentage}%)`;
}
}
}
}
}
});
// Cause Trend Chart
const causeTrendCtx = document.getElementById('causeTrendChart').getContext('2d');
const causeTrendChart = new Chart(causeTrendCtx, {
type: 'bar',
data: {
labels: ['2018', '2019', '2020', '2021', '2022', '2023'],
datasets: [
{
label: 'Aparelho circulatório',
data: [50, 35, 55, 36, 39, 45],
backgroundColor: 'rgba(239, 68, 68, 0.7)',
borderColor: 'rgba(239, 68, 68, 1)',
borderWidth: 1
},
{
label: 'Neoplasias',
data: [29, 30, 36, 25, 32, 35],
backgroundColor: 'rgba(139, 92, 246, 0.7)',
borderColor: 'rgba(139, 92, 246, 1)',
borderWidth: 1
},
{
label: 'Aparelho respiratório',
data: [21, 37, 23, 22, 17, 31],
backgroundColor: 'rgba(16, 185, 129, 0.7)',
borderColor: 'rgba(16, 185, 129, 1)',
borderWidth: 1
}
]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
title: {
display: true,
text: 'Evolução das Principais Causas de Óbito',
font: {
size: 14
}
},
tooltip: {
mode: 'index',
intersect: false
}
},
scales: {
y: {
beginAtZero: true,
title: {
display: true,
text: 'Número de Óbitos'
}
}
}
}
});
// Age Distribution Chart
const ageDistributionCtx = document.getElementById('ageDistributionChart').getContext('2d');
const ageDistributionChart = new Chart(ageDistributionCtx, {
type: 'bar',
data: {
labels: ['<1', '1-4', '5-9', '10-14', '15-19', '20-29', '30-39', '40-49', '50-59', '60-69', '70-79', '80+'],
datasets: [{
label: 'Óbitos por Faixa Etária (Total 2018-2023)',
data: [11, 4, 2, 1, 4, 11, 34, 56, 102, 203, 267, 366],
backgroundColor: 'rgba(59, 130, 246, 0.7)',
borderColor: 'rgba(59, 130, 246, 1)',
borderWidth: 1
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
title: {
display: true,
text: 'Distribuição por Faixa Etária (2018-2023)',
font: {
size: 14
}
},
tooltip: {
callbacks: {
label: function(context) {
const label = context.dataset.label || '';
const value = context.raw || 0;
const total = 1061;
const percentage = Math.round((value / total) * 100);
return `${value} óbitos (${percentage}%)`;
}
}
}
},
scales: {
y: {
beginAtZero: true,
title: {
display: true,
text: 'Número de Óbitos'
}
}
}
}
});
// Age Trend Chart
const ageTrendCtx = document.getElementById('ageTrendChart').getContext('2d');
const ageTrendChart = new Chart(ageTrendCtx, {
type: 'line',
data: {
labels: ['2018', '2019', '2020', '2021', '2022', '2023'],
datasets: [
{
label: '60-69 anos',
data: [29, 36, 27, 35, 34, 42],
borderColor: 'rgba(239, 68, 68, 1)',
backgroundColor: 'rgba(239, 68, 68, 0.1)',
borderWidth: 2,
fill: true,
tension: 0.4
},
{
label: '70-79 anos',
data: [39, 29, 48, 51, 53, 47],
borderColor: 'rgba(139, 92, 246, 1)',
backgroundColor: 'rgba(139, 92, 246, 0.1)',
borderWidth: 2,
fill: true,
tension: 0.4
},
{
label: '80+ anos',
data: [58, 59, 60, 64, 47, 78],
borderColor: 'rgba(16, 185, 129, 1)',
backgroundColor: 'rgba(16, 185, 129, 0.1)',
borderWidth: 2,
fill: true,
tension: 0.4
}
]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
title: {
display: true,
text: 'Evolução por Faixa Etária (Idosos)',
font: {
size: 14
}
},
tooltip: {
mode: 'index',
intersect: false
}
},
scales: {
y: {
beginAtZero: true,
title: {
display: true,
text: 'Número de Óbitos'
}
}
}
}
});
// Location Distribution Chart
const locationDistributionCtx = document.getElementById('locationDistributionChart').getContext('2d');
const locationDistributionChart = new Chart(locationDistributionCtx, {
type: 'pie',
data: {
labels: ['Hospital', 'Domicílio', 'Via pública', 'Outros'],
datasets: [{
data: [950, 79, 14, 18],
backgroundColor: [
'rgba(59, 130, 246, 0.7)',
'rgba(16, 185, 129, 0.7)',
'rgba(245, 158, 11, 0.7)',
'rgba(156, 163, 175, 0.7)'
],
borderColor: [
'rgba(59, 130, 246, 1)',
'rgba(16, 185, 129, 1)',
'rgba(245, 158, 11, 1)',
'rgba(156, 163, 175, 1)'
],
borderWidth: 1
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
title: {
display: true,
text: 'Distribuição por Local de Ocorrência (2018-2023)',
font: {
size: 14
}
},
tooltip: {
callbacks: {
label: function(context) {
const label = context.label || '';
const value = context.raw || 0;
const total = context.dataset.data.reduce((a, b) => a + b, 0);
const percentage = Math.round((value / total) * 100);
return `${label}: ${value} (${percentage}%)`;
}
}
}
}
}
});
// Location Trend Chart
const locationTrendCtx = document.getElementById('locationTrendChart').getContext('2d');
const locationTrendChart = new Chart(locationTrendCtx, {
type: 'line',
data: {
labels: ['2018', '2019', '2020', '2021', '2022', '2023'],
datasets: [
{
label: 'Hospital',
data: [121, 127, 155, 198, 153, 196],
borderColor: 'rgba(59, 130, 246, 1)',
backgroundColor: 'rgba(59, 130, 246, 0.1)',
borderWidth: 2,
fill: true,
tension: 0.4
},
{
label: 'Domicílio',
data: [27, 32, 7, 6, 4, 3],
borderColor: 'rgba(16, 185, 129, 1)',
backgroundColor: 'rgba(16, 185, 129, 0.1)',
borderWidth: 2,
fill: true,
tension: 0.4
}
]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
title: {
display: true,
text: 'Evolução por Local de Ocorrência',
font: {
size: 14
}
},
tooltip: {
mode: 'index',
intersect: false
}
},
scales: {
y: {
beginAtZero: true,
title: {
display: true,
text: 'Número de Óbitos'
}
}
}
}
});
// Women Chart
const womenCtx = document.getElementById('womenChart').getContext('2d');
const womenChart = new Chart(womenCtx, {
type: 'bar',
data: {
labels: ['2018', '2019', '2020', '2021', '2022', '2023'],
datasets: [{
label: 'Óbitos em Mulheres em Idade Fértil (15-49 anos)',
data: [6, 5, 4, 17, 3, 9],
backgroundColor: 'rgba(236, 72, 153, 0.7)',
borderColor: 'rgba(236, 72, 153, 1)',
borderWidth: 1
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
title: {
display: true,
text: 'Óbitos em Mulheres em Idade Fértil',
font: {
size: 14
}
}
},
scales: {
y: {
beginAtZero: true,
title: {
display: true,
text: 'Número de Óbitos'
}
}
}
}
});
// Children Chart
const childrenCtx = document.getElementById('childrenChart').getContext('2d');
const childrenChart = new Chart(childrenCtx, {
type: 'bar',
data: {
labels: ['2018', '2019', '2020', '2021', '2022', '2023'],
datasets: [{
label: 'Óbitos em Menores de 5 Anos',
data: [3, 4, 2, 5, 1, 2],
backgroundColor: 'rgba(56, 189, 248, 0.7)',
borderColor: 'rgba(56, 189, 248, 1)',
borderWidth: 1
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
title: {
display: true,
text: 'Óbitos em Menores de 5 Anos',
font: {
size: 14
}
}
},
scales: {
y: {
beginAtZero: true,
title: {
display: true,
text: 'Número de Óbitos'
}
}
}
}
});
// Avoidable Deaths Chart
const avoidableCtx = document.getElementById('avoidableChart').getContext('2d');
const avoidableChart = new Chart(avoidableCtx, {
type: 'bar',
data: {
labels: ['2019', '2020', '2021', '2022', '2023'],
datasets: [
{
label: 'Doenças infecciosas',
data: [12, 5, 5, 10, 12],
backgroundColor: 'rgba(239, 68, 68, 0.7)',
borderColor: 'rgba(239, 68, 68, 1)',
borderWidth: 1
},
{
label: 'Doenças não transmissíveis',
data: [37, 40, 41, 34, 38],
backgroundColor: 'rgba(139, 92, 246, 0.7)',
borderColor: 'rgba(139, 92, 246, 1)',
borderWidth: 1
},
{
label: 'Causas externas',
data: [8, 5, 9, 6, 8],
backgroundColor: 'rgba(16, 185, 129, 0.7)',
borderColor: 'rgba(16, 185, 129, 1)',
borderWidth: 1
}
]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
title: {
display: true,
text: 'Óbitos por Causas Evitáveis (2019-2023)',
font: {
size: 14
}
},
tooltip: {
mode: 'index',
intersect: false
}
},
scales: {
y: {
beginAtZero: true,
title: {
display: true,
text: 'Número de Óbitos'
}
}
}
}
});
</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/mortalidade" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
</html>