-
-
Save Marceloromeugoncalves/aaeb80835a41071960894a01b55cd4ef to your computer and use it in GitHub Desktop.
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>My Folium Map</title> | |
| <!-- Importa o arquivo CSS do Leaflet --> | |
| <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" crossorigin=""/> | |
| <!-- Importa o arquivo JavaScript do Leaflet --> | |
| <script src="https://unpkg.com/[email protected]/dist/leaflet.js" integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script> | |
| <style> | |
| /* Define estilos para o mapa */ | |
| #map { | |
| height: 500px; | |
| width: 100%; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <h2>My Folium Map</h2> | |
| <!-- Elemento div onde o mapa será mostrado --> | |
| <div id="map"></div> | |
| <!-- Inclui a biblioteca jQuery --> | |
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> | |
| <script> | |
| function createMap(mapId, latitude, longitude, zoom) { | |
| let initialCoordinates = [latitude, longitude]; | |
| let map = L.map(mapId).setView(initialCoordinates, zoom); | |
| return map; | |
| } | |
| function addTileLayer(map) { | |
| const tileLayer = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'; | |
| const attribution = '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'; | |
| const options = { attribution: attribution }; | |
| L.tileLayer(tileLayer, options).addTo(map); | |
| } | |
| function addMarker(map, latitude, longitude, message) { | |
| let markerCoordinates = [latitude, longitude]; | |
| L.marker(markerCoordinates).addTo(map).bindPopup(message).openPopup(); | |
| } | |
| $(document).ready(function() { | |
| let map = createMap('map', 51.505, -0.09, 13); | |
| addTileLayer(map); | |
| addMarker(map, 51.5, -0.09, 'Teste'); | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Coordenadas Geográficas
As coordenadas geográficas são um sistema de referência utilizado para localizar pontos específicos na superfície da Terra. Elas são fundamentais para a cartografia, navegação, geografia e muitas outras áreas relacionadas à localização e mapeamento.
Existem dois tipos principais de coordenadas geográficas:
-
Latitude:
- A latitude é a medida angular que descreve a distância de um ponto em relação à linha do equador, medida em graus para o norte ou sul. O equador é considerado o ponto de referência, e a latitude varia de 0° no equador até 90° nos polos norte e sul.
- A latitude norte é representada como um valor positivo, enquanto a latitude sul é representada como um valor negativo. Por exemplo, a cidade de São Paulo, Brasil, está aproximadamente à latitude 23°S.
-
Longitude:
- A longitude é a medida angular que descreve a distância de um ponto em relação ao meridiano de Greenwich, medida em graus para o leste ou oeste. O meridiano de Greenwich, localizado em Londres, Inglaterra, é considerado o meridiano principal de referência e possui uma longitude de 0°.
- A longitude leste é representada como um valor positivo, enquanto a longitude oeste é representada como um valor negativo. Por exemplo, a cidade de Tóquio, Japão, está aproximadamente à longitude 139°E.
As coordenadas geográficas são frequentemente expressas em graus decimais, onde minutos e segundos são convertidos em frações de graus. Por exemplo, a localização da Estátua da Liberdade em Nova York é aproximadamente 40.6892° de latitude norte e -74.0445° de longitude oeste.
As coordenadas geográficas são essenciais para identificar a posição de lugares específicos no planeta Terra e são amplamente utilizadas em sistemas de posicionamento global (GPS), mapas, navegação marítima e aérea, geolocalização em dispositivos móveis, planejamento urbano, estudos ambientais e muito mais.
Em resumo, as coordenadas geográficas fornecem um sistema de referência universalmente reconhecido para localizar pontos na Terra, permitindo uma comunicação precisa e uma compreensão clara da localização de lugares e eventos em nosso planeta.
Leaflet
O Leaflet é uma biblioteca de mapeamento interativo em JavaScript amplamente utilizada para criar mapas interativos em aplicações web. Ele fornece uma maneira simples e flexível de exibir mapas interativos em páginas da web, oferecendo uma variedade de recursos poderosos para visualização de dados geoespaciais.
Aqui estão alguns pontos importantes sobre o Leaflet:
Leve e Flexível: O Leaflet é uma biblioteca leve, com cerca de 38 KB minificado e comprimido. Isso o torna rápido para carregar e adequado para uso em uma variedade de dispositivos, incluindo desktops, tablets e smartphones. Além disso, o Leaflet é altamente flexível e pode ser estendido com plugins para adicionar funcionalidades adicionais conforme necessário.
Facilidade de Uso: Uma das maiores vantagens do Leaflet é sua facilidade de uso. Ele possui uma API simples e intuitiva que permite criar e personalizar mapas com facilidade. Mesmo aqueles com pouca experiência em programação podem começar a criar mapas interativos em pouco tempo.
Suporte a Múltiplos Fornecedores de Mapas: O Leaflet suporta vários provedores de mapas, incluindo OpenStreetMap, Mapbox, Esri, Google Maps e muitos outros. Isso permite que os desenvolvedores escolham o provedor de mapa que melhor se adapta às suas necessidades, seja gratuito ou baseado em assinatura.
Funcionalidades Avançadas: Embora seja simples de usar, o Leaflet oferece uma variedade de funcionalidades avançadas, como camadas de blocos personalizadas, marcadores interativos, polígonos, linhas, popups, controle de zoom, eventos de interação do usuário e muito mais. Ele também suporta mapas de satélite, mapas topográficos e mapas de calor.
Comunidade Ativa: O Leaflet possui uma comunidade de desenvolvedores ativos que contribuem com plugins, tutoriais e suporte. Isso significa que há uma abundância de recursos disponíveis para ajudar os desenvolvedores a resolver problemas e estender a funcionalidade do Leaflet conforme necessário.
Licença de Código Aberto: O Leaflet é distribuído sob a licença BSD de código aberto, o que significa que é livre para uso e pode ser modificado e redistribuído de acordo com os termos da licença. Isso o torna uma escolha popular para uma ampla variedade de projetos, desde pequenos sites até aplicativos empresariais de grande escala.
Em resumo, o Leaflet é uma poderosa e acessível biblioteca de mapeamento que permite aos desenvolvedores criar mapas interativos e visualizações de dados geoespaciais em páginas da web com facilidade e flexibilidade. Sua simplicidade de uso, suporte a múltiplos fornecedores de mapas e comunidade ativa o tornam uma escolha popular entre os desenvolvedores que buscam incorporar mapas em seus projetos web.