Created
February 20, 2024 11:27
-
-
Save Marceloromeugoncalves/aaeb80835a41071960894a01b55cd4ef to your computer and use it in GitHub Desktop.
Exemplo Leaflet.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!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> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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:
Longitude:
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.