|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
import re
|
|
|
import html
|
|
|
import requests
|
|
|
import gradio as gr
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
_COORD_RE = re.compile(
|
|
|
r"""
|
|
|
^\s*
|
|
|
(?:lat\s*[:=]?\s*)?(-?\d+(?:\.\d+)?)
|
|
|
(?:\s*[,;]\s*|\s+)
|
|
|
(?:lon|lng|long)?\s*[:=]?\s*(-?\d+(?:\.\d+)?)
|
|
|
\s*$
|
|
|
""",
|
|
|
re.IGNORECASE | re.VERBOSE
|
|
|
)
|
|
|
|
|
|
|
|
|
def parse_coords(text: str):
|
|
|
if not text:
|
|
|
return None
|
|
|
m = _COORD_RE.match(text.strip())
|
|
|
if not m:
|
|
|
return None
|
|
|
|
|
|
lat = float(m.group(1))
|
|
|
lon = float(m.group(2))
|
|
|
|
|
|
if not (-90 <= lat <= 90 and -180 <= lon <= 180):
|
|
|
raise ValueError("Coordenadas fora do intervalo válido.")
|
|
|
|
|
|
return lat, lon
|
|
|
|
|
|
|
|
|
def geocode_by_name(query: str):
|
|
|
url = "https://nominatim.openstreetmap.org/search"
|
|
|
params = {"q": query, "format": "jsonv2", "limit": 1}
|
|
|
headers = {"User-Agent": "GradioMapFullPage"}
|
|
|
|
|
|
r = requests.get(url, params=params, headers=headers, timeout=20)
|
|
|
r.raise_for_status()
|
|
|
data = r.json()
|
|
|
|
|
|
if not data:
|
|
|
raise ValueError(f"Local não encontrado: {query}")
|
|
|
|
|
|
lat = float(data[0]["lat"])
|
|
|
lon = float(data[0]["lon"])
|
|
|
name = data[0].get("display_name", query)
|
|
|
return lat, lon, name
|
|
|
|
|
|
|
|
|
def resolve_location(mode, place, lat, lon):
|
|
|
if mode == "coords":
|
|
|
return float(lat), float(lon), f"{lat:.6f}, {lon:.6f}"
|
|
|
|
|
|
if mode == "auto":
|
|
|
parsed = parse_coords(place)
|
|
|
if parsed:
|
|
|
la, lo = parsed
|
|
|
return la, lo, f"{la:.6f}, {lo:.6f}"
|
|
|
|
|
|
return geocode_by_name(place)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
def build_srcdoc(lat, lon, zoom, basemap, title):
|
|
|
sv0 = f"https://www.google.com/maps/@?api=1&map_action=pano&viewpoint={lat:.7f},{lon:.7f}"
|
|
|
a0 = f"https://maps.apple.com/place?coordinate={lat:.7f},{lon:.7f}"
|
|
|
|
|
|
doc = f"""
|
|
|
<!doctype html>
|
|
|
<html>
|
|
|
<head>
|
|
|
<meta charset="utf-8"/>
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
|
|
|
|
|
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"/>
|
|
|
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
|
|
|
|
|
|
<style>
|
|
|
html, body {{
|
|
|
margin:0;
|
|
|
padding:0;
|
|
|
width:100%;
|
|
|
}}
|
|
|
|
|
|
.wrap {{
|
|
|
width:100%;
|
|
|
padding:12px;
|
|
|
}}
|
|
|
|
|
|
#map {{
|
|
|
width:100%;
|
|
|
height:70vh;
|
|
|
border-radius:14px;
|
|
|
border:1px solid #e5e7eb;
|
|
|
}}
|
|
|
|
|
|
.panel {{
|
|
|
margin-top:10px;
|
|
|
padding:12px;
|
|
|
border:1px solid #e5e7eb;
|
|
|
border-radius:14px;
|
|
|
}}
|
|
|
|
|
|
.btns {{
|
|
|
display:flex;
|
|
|
gap:10px;
|
|
|
margin-top:8px;
|
|
|
}}
|
|
|
|
|
|
.btn {{
|
|
|
padding:10px 14px;
|
|
|
border-radius:10px;
|
|
|
font-weight:700;
|
|
|
text-decoration:none;
|
|
|
color:white;
|
|
|
}}
|
|
|
|
|
|
.btn.google {{ background:#1a73e8; }}
|
|
|
.btn.apple {{ background:#000; }}
|
|
|
|
|
|
code {{
|
|
|
background:#f3f4f6;
|
|
|
padding:3px 8px;
|
|
|
border-radius:8px;
|
|
|
}}
|
|
|
</style>
|
|
|
</head>
|
|
|
|
|
|
<body>
|
|
|
<div class="wrap">
|
|
|
<h3>{html.escape(title)}</h3>
|
|
|
<div id="map"></div>
|
|
|
|
|
|
<div class="panel">
|
|
|
<div><b>Coordenadas:</b> <code id="coords">{lat:.7f}, {lon:.7f}</code></div>
|
|
|
|
|
|
<div class="btns">
|
|
|
<a id="streetLink" class="btn google" href="{sv0}" target="_blank">Google Street View</a>
|
|
|
<a id="appleLink" class="btn apple" href="{a0}" target="_blank">Apple Maps</a>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<script>
|
|
|
const map = L.map('map').setView([{lat:.7f}, {lon:.7f}], {zoom});
|
|
|
|
|
|
const bases = {{
|
|
|
"OSM": L.tileLayer('https://{{s}}.tile.openstreetmap.org/{{z}}/{{x}}/{{y}}.png'),
|
|
|
"Esri Satellite": L.tileLayer(
|
|
|
'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{{z}}/{{y}}/{{x}}')
|
|
|
}};
|
|
|
|
|
|
(bases["{basemap}"] || bases["OSM"]).addTo(map);
|
|
|
L.control.layers(bases).addTo(map);
|
|
|
|
|
|
let marker = L.marker([{lat:.7f}, {lon:.7f}]).addTo(map);
|
|
|
|
|
|
function update(lat, lon) {{
|
|
|
marker.setLatLng([lat, lon]);
|
|
|
document.getElementById("coords").textContent =
|
|
|
lat.toFixed(7) + ", " + lon.toFixed(7);
|
|
|
|
|
|
document.getElementById("streetLink").href =
|
|
|
"https://www.google.com/maps/@?api=1&map_action=pano&viewpoint=" + lat + "," + lon;
|
|
|
|
|
|
document.getElementById("appleLink").href =
|
|
|
"https://maps.apple.com/place?coordinate=" + lat + "," + lon;
|
|
|
}}
|
|
|
|
|
|
map.on("click", e => update(e.latlng.lat, e.latlng.lng));
|
|
|
</script>
|
|
|
</body>
|
|
|
</html>
|
|
|
"""
|
|
|
return html.escape(doc, quote=True)
|
|
|
|
|
|
|
|
|
def run(mode, place, lat, lon, zoom, basemap):
|
|
|
lat0, lon0, name = resolve_location(mode, place, lat, lon)
|
|
|
srcdoc = build_srcdoc(lat0, lon0, zoom, basemap, f"📍 {name}")
|
|
|
iframe = f'<iframe style="width:100vw; height:85vh; border:0;" srcdoc="{srcdoc}"></iframe>'
|
|
|
return f"OK — {name}", iframe
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
CSS = """
|
|
|
.gradio-container {
|
|
|
max-width: 100% !important;
|
|
|
padding-left: 0 !important;
|
|
|
padding-right: 0 !important;
|
|
|
}
|
|
|
"""
|
|
|
|
|
|
with gr.Blocks(css=CSS, title="Mapa Full Page") as demo:
|
|
|
with gr.Row():
|
|
|
mode = gr.Radio(["auto", "nome", "coords"], value="auto", label="Modo")
|
|
|
|
|
|
place = gr.Textbox(label="Local ou coordenadas", value="Lisboa")
|
|
|
lat_in = gr.Number(label="Latitude", value=38.7223, precision=7)
|
|
|
lon_in = gr.Number(label="Longitude", value=-9.1393, precision=7)
|
|
|
|
|
|
basemap = gr.Dropdown(["Esri Satellite", "OSM"], value="Esri Satellite", label="Base map")
|
|
|
zoom = gr.Slider(3, 20, value=16, label="Zoom")
|
|
|
|
|
|
btn = gr.Button("Mostrar", variant="primary")
|
|
|
status = gr.Textbox(label="Status", interactive=False)
|
|
|
view = gr.HTML()
|
|
|
|
|
|
btn.click(run, [mode, place, lat_in, lon_in, zoom, basemap], [status, view])
|
|
|
demo.load(lambda: run("auto", "Lisboa", 38.7223, -9.1393, 12, "Esri Satellite"), outputs=[status, view])
|
|
|
|
|
|
demo.launch()
|
|
|
|
