Leaflet координаты

#javascript #google_maps_api #leafletjs #mapbox

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

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


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

Ответы

Ответ 1

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

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


См также:


Исходник L.TileLayer


Ответ 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);
                    });


Может это можно было сделать как-то более изящно... И странное поведение появилось
- отрисовывается только половину маркеров почему-то...