Листовка показывает несколько маркеров и setView - PullRequest
Новая
       8

Листовка показывает несколько маркеров и setView

0 голосов
/ 10 апреля 2020

У меня есть пример кода, который использует Leaflet и open street map. Тем не менее, я не уверен, как я могу добавить больше markers. Кроме того, я не совсем понимаю смысл функции setView, которую я прочитал, что она для centering map, но какой смысл иметь ее, поскольку есть только одна marker, которая должна автоматически быть в качестве map центральной точки, а с другой стороны, если будет больше маркеров, в чем смысл setView?

Дополнительный вопрос: Является ли Leaflet и открытая карта улиц бесплатными для коммерческого использования? 

<code><!DOCTYPE html>

<html>

<head>
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css" integrity="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ==" crossorigin="" />
    <script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet.js" integrity="sha512-/Nsx9X4HebavoBvEBuyp3I7od5tA0UzAxs+j83KgC8PU0kgB4XiK4Lfe4y4cgBtaRJQEIFCW+oC506aPT2L1zw==" crossorigin=""></script>
</head>

<body>
<div id="mapDiv" style="width: 800px; height: 500px"></div>
<script>
    // position we will use later
    var lat = 40.73;
    var lon = -74.00;

    // initialize map
    map = L.map('mapDiv').setView([lat, lon], 13);

    // set map tiles source
    L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
        attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors',
        maxZoom: 18,
    }).addTo(map);

    // add marker to the map
    marker = L.marker([lat, lon]).addTo(map);

    // add popup to the marker
    marker.bindPopup("<b>ACME CO.</b><br />This st. 48<br />New York").openPopup();

</script>
</body>

</html>

1 Ответ

1 голос
/ 10 апреля 2020

есть только один маркер, который должен быть автоматически в качестве центральной точки карты

В самом буклете нет ничего, что бы автоматически центрировало вид карты на вашем единственном маркере.

С другой стороны, пример кода, который вы показываете, достигает этого, используя setView в тех же координатах, что и ваш единственный маркер.

, если будет больше маркеров, в чем смысл setView ?

setView дает вам возможность определить, какую часть карты вы хотите первоначально отобразить в вашем окне просмотра, независимо от содержимого / слоев карты (в вашем случае: ваших маркеров). Очевидно, что вы можете определить представление, которое также отображает все ваши Маркеры одновременно.

Я не уверен, как я могу добавить больше маркеров.

Do L.marker([lat, lon]).addTo(map); как столько раз, сколько нужно, с lat и lon, отличающимися каждый раз при необходимости.

Является ли Leaflet и открытая карта улиц бесплатными для коммерческого использования?

Leaflet is распространяется по лицензии BSD 2-пункт , разрешено коммерческое использование.

OpenStreetMap данные бесплатны, но не мозаика , сгенерированная OSM сервера. Существует множество сервисов, генерирующих похожие листы из данных OSM или других источников, которые вы можете проверить. Например, вы можете искать «поставщиков листовок».

...