4

Подскажите, как я могу получить координаты углов каждого тайла?

                var layers = {
                    Streets: L.mapbox.tileLayer('mapbox.streets'),
                };
                layers.Streets.on('tileload', function (e) {
                    ... как-то получить координаты углов загрузившегося тайла ...
                });

Версия leaflet 0.7.7. Благодарю!

2 ответа 2

4

В обработчик события tileload передается объект {tile: ... , url: ... }. Элемент tile является HTML элементом <img /> с некоторыми допольнительными параметрами. Один из них _leaflet_pos - отступ в пикселах от левого верхнего угла видимой части карты (поскольку параметр начинается с подчеркивания, подразумевается что он приватный, его не будет в документации и он запросто может называться в другой версии иначе или вообще отсутствовать). Также эти значения можно увидеть в параметре inline-стиля transform. Чтобы перевести пикселы в координаты, можно воспользоваться методом layerPointToLatLng. Например так:

layers.Streets.on('tileload', function (e) {
    console.log(mymap.layerPointToLatLng(e.tile._leaflet_pos));
});

См также:

  1. Исходник L.TileLayer
2
  • А как я могу найти координаты верхнего левого угла?
    – RSalnikov
    6 сен 2016 в 21:15
  • 1
    Так вот как раз они и получатся на выходе mymap.layerPointToLatLng(e.tile._leaflet_pos). Если понадобятся другие углы, то в пиксельных координатах нужно будет прибавлять размер тайла, потом переводить в угловые. 6 сен 2016 в 21:19
2

Вроде все получилось

var layers = {
                Streets: L.mapbox.tileLayer('mapbox.streets'),
            };
                    layers.Streets.on('tileload', function (e) {
                        var topLeft = map.layerPointToLatLng([e.tile._leaflet_pos.y, e.tile._leaflet_pos.x]);
                        var topRight = map.layerPointToLatLng([e.tile._leaflet_pos.y, e.tile._leaflet_pos.x + layers.Streets.options.tileSize]);
                        var downLeft = map.layerPointToLatLng([e.tile._leaflet_pos.y + layers.Streets.options.tileSize, e.tile._leaflet_pos.x]);
                        var downRight = map.layerPointToLatLng([e.tile._leaflet_pos.y + layers.Streets.options.tileSize, e.tile._leaflet_pos.x + layers.Streets.options.tileSize]);
                        L.marker([topLeft.lat, topLeft.lng]).addTo(map);
                        L.marker([topRight.lat, topRight.lng]).addTo(map);
                        L.marker([downLeft.lat, downLeft.lng]).addTo(map);
                        L.marker([downRight.lat, downRight.lng]).addTo(map);
                    });

Может это можно было сделать как-то более изящно... И странное поведение появилось - отрисовывается только половину маркеров почему-то... http://image.prntscr.com/image/c42fb1b161b74a55babce747a9d38355.png

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.