Entendendo o mapa do estado de São Paulo e suas cidades
Produzir um mapa completo do estado de São Paulo com todas as cidades exige alguns cuidados práticos que a maioria dos tutoriais não menciona. O estado tem 645 municípios, o que já por si só é um desafio de renderização e carregamento. Vou explicar como fazer isso direito, sem rodeio.
Como montar um mapa estado de sp cidades interativo
A abordagem mais comum é usar a API do IBGE para puxar os shapefiles dos municípios e depois renderizar com Leaflet ou Mapbox GL JS. Baixe os arquivos no site do IBGE Geociências - a pasta com as divisões municipais está em https://www.ibge.gov.br/geociencias/organizacao-do-territorio/malha-territorial.html. O arquivo que você precisa é o "Municipios" no formato Shapefile, CRS SIRGAS 2000 (EPSG:4674). O problema que eu encontrei na prática é que o shapefile original tem mais de 200 MB, e carregar isso no navegador simplesmente trava. Minha solução foi converter para GeoJSON com TopoJSON e simplificar as geometrias usando o GDAL. Um comando como `ogr2ogr -f GeoJSON -simplify 0.01 municipios.geojson municipios.shp` reduz o arquivo para cerca de 8 MB mantendo a precisão suficiente para visualização em tela cheia. Para mapas mais detalhados, use simplificações menores como 0.005, mas isso dobra o tamanho.
Depois da conversão, a estrutura básica com Leaflet fica assim: Carregue o GeoJSON com `fetch()` e adicione como camada L.geoJSON(). Para cada feature, vincule os dados do município (nome, código IBGE, população) ao objeto que vem embutido nas propriedades. A paleta de cores depende do que você quer mostrar - densidade demográfica, IDH, PIB per capita. Eu sempre uso a library d3-scale-chromatic para gerar escalas sequenciais confiáveis, o que evita aquele visual amador de cores aleatórias.
👉 Clique no botão abaixo para saber mais sobre o assunto!
Dados que você precisa além da geometria
O shapefile do IBGE traz apenas o nome e o código do município. Para algo útil, você precisa cruzar com o Censo 2022 ou com as estimativas anuais. O dado poblacional do IBGE em https://cidades.ibge.gov.br/ tem tudo pronto em formato download. O campo pop2022 é o mais confiável atualmente. Outro ponto que poucas pessoas levam em conta: a capital São Paulo tem uma malha urbana tão complexa que o limite municipal se perde. Se o seu mapa tiver zoom profundo, o município da capital vai parecer um quadrado genérico. A solução é sobrepor os bairros como uma segunda camada, também disponível no shapefile do IBGE em resolução maior.
Pegadinhas comuns e alternativas
Um erro frequente é tentar gerar o mapa inteiramente no front-end com todos os 645 municípios. Em dispositivos móveis mais lentos, o tempo de renderização dos polígonos pode passar de 3 segundos. Nesse caso, o ideal é processar no back-end com Mapbox Vector Tiles ou GeoServer, que entrega chunks geolocalizados conforme o usuário dá zoom. Isso corta o tempo de carregamento inicial para menos de meio segundo. Se o objetivo é apenas imprimir ou apresentar um mapa estático, considere usar o QGIS em vez de desenvolvimento web. Carrega o shapefile, aplica simologia de cor baseada em atributos, adiciona legendas e exporta como PNG ou PDF em minutos. A curva de aprendizado é maior no início, mas para um único mapa finalizado, compensa muito mais do que escrever código.
Também vale mencionar que alguns municípios passaram por alterações de fronteira recentes, especialmente na região metropolitana de São Paulo e no Vale do Paraíba. Oshapefile do IBGE é atualizado anualmente, mas se você usar uma versão mais antiga, pode encontrar nomes de municípios que mudaram ou áreas transferidas entre cidades. Sempre cheque a data de referência do arquivo antes de publicar qualquer coisa.
