Я начинаю играть с кодом, который может генерировать карты. Сейчас я рассматриваю OSM (OpenStreetMaps) как отличное решение. Также LeafletJS позволяет очень легко рисовать карты на основе OSM. Все идет нормально.
Я хотел бы иметь возможность нарисовать контур (границу) округа и пытаюсь понять, как будет выглядеть этот процесс. Мне сначала вызвать, чтобы найти координаты, а затем передать их в Leaflet или есть лучший способ?
Я могу получить границы, используя Nominatim API, но вызывая так:
https://nominatim.openstreetmap.org/ui/search.html?state=tx&county=Lee
И я могу нарисовать область в Leaflet следующим образом:
var polygon = L.polygon([
[51.509, -0.08],
[51.503, -0.06],
[51.51, -0.047]
]).addTo(mymap);
Итак, я слишком много думаю или это так работает?
Вы можете создать одну функцию, чтобы получить геометрию округа и добавить ее на карту. Попробуйте следующий код:
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) {
geojsonFeature = json[0].geojson;
L.geoJSON(geojsonFeature).addTo(map);
});
}
drawCountyBoundary('Lee', 'Tx')
Также я добавил map = L.map("mapCnty"); но все равно не повезло.
Вот моя неудачная попытка: jsfiddle.net/9ax2u0ty
Попробуйте эту скрипку.
Это выглядит здорово, спасибо. Поскольку штат может быть за пределами холста для этого представления, я думаю, я могу начать с полного представления штата, затем добавить контур округа, а затем увеличить масштаб и центрировать. Но это, безусловно, отличное начало!
Да, вы можете установить вид на центр штата. Предполагая, что только округа Техаса, вид может быть установлен как:var map = L.map('map').setView([31.3913424,-99.1712139], 5);
Да, конечно. В LeafletJS есть что-то вроде .flyTo(), которое поможет с масштабированием. Я думаю, мне нужно выяснить viewBox округа, прежде чем запускать его.
Вау, это выглядит очень здорово, спасибо! Я получаю следующую ошибку JS и не знаю, почему: Uncaught (в обещании) TypeError: t.addLayer не является функцией