• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

125
Vistas
Ajustar límites dentro del mapa

Uso OSM para mostrar los límites del condado. Funciona bien la mayor parte del tiempo, pero en algunos casos los condados son más grandes y no caben en el mapa.

¿Cómo ajusto el nivel de zoom antes de iniciar el renderizado?

 var map = L.map("mapCnty").setView([31.2506372, -102.3385429], 5); map.attributionControl.setPrefix(); L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", { attribution: \'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors\' }).addTo(map); function drawCountyBoundary(county, state) { url = "https://nominatim.openstreetmap.org/search.php?county=" + county + "&state=" + state + "&polygon_geojson=1&format=jsonv2"; fetch(url).then(function(response) { return response.json(); }) .then(function(json) { map.flyTo([json[0].lat, json[0].lon], 9); setTimeout(function(){ geojsonFeature = json[0].geojson; L.geoJSON(geojsonFeature).addTo(map); }, 1900); }); } drawCountyBoundary("Cibola", "NM");
almost 3 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

El nivel de zoom se puede calcular mediante _getBoundsCenterZoom()

 <html> <head> <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A==" crossorigin=""/> </head> <body> <div id="mapCnty" style="width:500px;height:500px;"></div> <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js" integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" crossorigin=""></script> <script> var map = L.map("mapCnty").setView([31.2506372, -102.3385429], 5); map.attributionControl.setPrefix(); L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", { attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors' }).addTo(map); function drawCountyBoundary(county, state) { url = "https://nominatim.openstreetmap.org/search.php?county=" + county + "&state=" + state + "&polygon_geojson=1&format=jsonv2"; fetch(url).then(function(response) { return response.json(); }) .then(function(json) { let geojsonFeature = json[0].geojson; let layer = L.geoJSON(geojsonFeature); // calc the zoom level let z = map._getBoundsCenterZoom(layer.getBounds()); // fly duration, unit: second let flyDuration = 1.5; map.flyTo([json[0].lat, json[0].lon], z.zoom, {duration:flyDuration}); setTimeout(function(){ layer.addTo(map); }, flyDuration*1000); }); } drawCountyBoundary("Cibola", "NM"); </script> </body> </html>

almost 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda