https://thi747.github.io/onde-estive-br/
Este projeto exibe um mapa interativo do Brasil que colore os estados
conforme um status numérico enviado via parâmetro de URL ?q=
. Além
disso, possui uma legenda para explicar as cores e uma tabela que mostra
a tradução da query string para os estados. O projeto também inclui um
botão para gerar uma configuração aleatória dos estados.
- Mapa Interativo: Mapa SVG do Brasil com todos os estados.
- Coloração por Status: Cada estado é colorido de acordo com um
status numérico fornecido via parâmetro
?q=
. - Legenda: Mostra as cores e seus significados.
- Tabela de Tradução: Exibe os estados e seus respectivos valores da query string.
- Botão Randomizar: Gera e aplica uma configuração aleatória de estados.
- HTML
- CSS
- JavaScript
Clone este repositório em sua máquina local usando o seguinte comando:
git clone https://github.com/thi747/onde-estive-br.git
Navegue até o diretório do projeto e abra o arquivo index.html
em um navegador web, preferencialmente atráves de um web server ou live server (devido CORS).
Para colorir os estados, adicione o parâmetro ?q=
na URL, seguido por
uma string de 27 números (0-6), onde cada dígito representa o status de
um estado, na ordem alfabética dos códigos UF.
Exemplo: https://thi747.github.io/onde-estive-br/?q=430435133060063604300005030
Clique no botão "Randomizar" para gerar uma configuração aleatória dos estados.
Código | Cor | Significado |
---|---|---|
0 | Branco | Nenhuma interação |
1 | Verde | Reside |
2 | Laranja | Já residiu |
3 | Azul | Lazer |
4 | Vermelho | Trabalho |
5 | Roxo | Lazer + Trabalho |
6 | Amarelo | Apenas passagem |
index.html
: Estrutura básica do HTML;css/styles.css
: Estilos para o layout e cores do mapa;js/scripts.js
: Lógica para colorir o mapa, preencher a legenda e manipular o botão de randomização;js/utils.js
: Lógica comum para inserir os vetores no mapa;js/uf/*
: Dados de vetorização e localização de cada UF;
Este projeto está licenciado sob a MIT License.
Você é livre para utilizar este projeto conforme os termos da licença. Lembre-se de atribuir o devido crédito ao repositório original.