Leaflet — новая JavaScript-библиотека для карт от CloudMade

CIIeKtR · 2012-09-28 20:17:45

Или подскажите как расширить circle, добавив ему контейнер с меткой?

PShA · 2012-09-29 18:46:07

Попап он на то и попап чтоб быть одним.
Добавить метку можно с помощью DivIcon - в него можно запихать произвольный текст

PShA · 2012-09-29 18:54:48

2RedFox:
Какой-то баг с очередностью, вставил пока try-catch

CIIeKtR · 2012-10-04 19:13:42

PShA wrote:

Попап он на то и попап чтоб быть одним.
Добавить метку можно с помощью DivIcon - в него можно запихать произвольный текст

Спасибо.

dimqua · 2012-11-04 16:24:37

Если не трудно, ответьте, пожалуйста, на пару простых вопросов новичка.

1. Как сделать так, чтобы список слоёв отображался по щелчку, а не при наведении мыши на иконку? Т.е. как в Open Layers.
2. Для просмотра карты в полноэкранном режиме я использую плагин leaflet.fullscreen. По умолчанию он использует лишь одну иконку (переход в полноэкранный режим). Но было бы правильнее, если бы при переходе в полноэкранный режим он отображал бы другую иконку (переход в обычный режим), а не ту же самую. Т.е., как плагин для Open Layers <https://github.com/fredj/openlayers-fullscreen>.

vvoovv · 2012-11-15 12:28:52

Я работаю над библиотекой djeo, которая позволяет создавать географические браузерные приложения на основе лучших географических веб-API, используя единый программный интерфейс.

Только что я добавил поддержку Leaflet.

Также поддерживаются
Google Maps API
Google Earth API,
ArcGIS API for JavaScript
Yandex Maps API

Вот демо-пример под управлением Leaflet, который позволяет просматривать содержимое OSM-файла. Важно: происходит загрузка OSM-файла размером 12 Мб!

С работой других движков и описанием демо-примера можно ознакомится в соседней теме.

Приглашаю послушать мой доклад на конференции Открытые ГИС! в субботу, 17 ноября, в 17.40:
Библиотека djeo: единый API для лучших географических веб-API

Доклад разработчика Leaflet, Владимира Агафонкина, будет в воскресенье, 18 ноября, в 13.40. Семинар о Leaflet будет в также в воскресенье, 18 ноября, в 11.20

Last edited by vvoovv (2012-11-15 12:35:18)

denisPskov · 2012-11-16 11:15:12

geojson = L.geoJson(bdata, {
style: function(feature) {
switch (feature.properties.name) {
case 'Network': return netstyle;
default: return allstyle;
}
},
onEachFeature: onEachFeature,
filter: function(feature, layer) {
return feature.properties.network;
},
pointToLayer: function (feature, latlng) {
return L.circleMarker(latlng, pcstyle);
}
});
var baseMaps;
var overlayMaps;
var control;
baseMaps = {"Администрация ПО": l1, "Сетевая инфраструктура": l2};
overlayMaps = {"Сетевая инфраструкткра 1-ого этажа": geojson};
control = L.control.layers(baseMaps, overlayMaps);
map.addControl(control);
map.p=0;
map.r=0;
addlevel = function(e) {
if (map.hasLayer(geojson)) {
if (map.getZoom()>=13) {
map.addLayer(pc1);
map.addLayer(pc2);
}
else {
map.p=1;
}
}
if (map.hasLayer(l1) && map.r==1) {
// map.removeControl(control);
control.addOverlay(geojson,"Сетевая инфраструкткра 1-ого этажа");
// baseMaps = {"Администрация ПО": l1, "Сетевая инфраструктура": l2};
// overlayMaps = {"Сетевая инфраструкткра 1-ого этажа": geojson};
// control = L.control.layers(baseMaps, overlayMaps);
// map.addControl(control);
map.r=0;
}
if (map.hasLayer(l2)) {
if (map.hasLayer(geojson)) {
map.removeLayer(geojson);
}
// map.removeControl(control);
control.removeLayer(geojson);
// baseMaps = {"Администрация ПО": l1, "Сетевая инфраструктура": l2};
// control = L.control.layers(baseMaps, null);
// map.addControl(control);
map.r=1;
}
}
removelevel = function(e) {
if (!map.hasLayer(geojson) && map.hasLayer(pc2) && map.hasLayer(pc1)) {
map.removeLayer(pc2);
map.removeLayer(pc1);
}
}
handleZoomChange = function(e){
if(map.getZoom()>=13) {
if (map.p==1 && map.hasLayer(geojson)) {
map.addLayer(pc2);
map.addLayer(pc1);
map.p=0;
}
}
else {
if (map.p==0 && map.hasLayer(geojson)) {
map.removeLayer(pc2);
map.removeLayer(pc1);
map.p=1;
}
}
}
map.on({layeradd: addlevel,
layerremove: removelevel,
zoomend: handleZoomChange
});

при переключении на слой l2 выдает ошибку 'Cannot read property 'layerId' of undefined', если убрать '//'(поставить где надо), то выдает 'Cannot call method 'removeLayer' of null', в чем причина???? или какой альтернативный вариант динамического control.layers?

s-s-s · 2012-11-22 10:27:40

Всем привет.
Хотелось бы иметь такой функционал у себя в Leaflet
Карта с удобным просмотром координат + калькулятор координат - http://pohodushki.org/ru/conversion-geo-coordinates
Может он уже есть?

putnik · 2012-11-22 14:21:30

s-s-s wrote:

Всем привет.
Хотелось бы иметь такой функционал у себя в Leaflet
Карта с удобным просмотром координат + калькулятор координат - http://pohodushki.org/ru/conversion-geo-coordinates
Может он уже есть?

Так всё же есть для этого: поменяли поле — пересчитайте остальные и передвиньте маркер; передвинули маркер — получите координаты и пересчитайте табличку.

PShA · 2012-11-22 15:32:45

map.on("moveend", пересчитать(map.getCenter());

msTi · 2012-12-06 13:45:51

Смотрю на пример ImageOverlay из документации:

var imageUrl = 'http://www.lib.utexas.edu/maps/historical/newark_nj_1922.jpg',
     imageBounds = [[40.712216, -74.22655], [40.773941, -74.12544]];

L.imageOverlay(imageUrl, imageBounds).addTo(map);

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

нужно сделать что то вроде тынц.

AndreyCool · 2012-12-12 06:53:34

Добрый день, возможно ли задать ограничивающую область экрана, за которую нельзя сдвинуть карту?
Наколхозить я сам могу, но может есть стандартные методы?

msTi · 2012-12-12 10:36:17

AndreyCool wrote:

Добрый день, возможно ли задать ограничивающую область экрана, за которую нельзя сдвинуть карту?
Наколхозить я сам могу, но может есть стандартные методы?

maxBounds

AndreyCool · 2012-12-12 12:11:30

msTi wrote:

maxBounds

не совсем то

also not allowing to zoom out to a view that's larger than the given bounds (depending on the map size).

нужная область зумится больше, чем нужно

2Gareen · 2012-12-13 10:50:27

Приветствую всех. Есть вопрос: можно ли задать id объекту на карте(маркер, полигон) и получать его при клике по объекту? Это нужно для автоматической подгрузки текста в popup. Заранее благодарю за помощь.

msTi · 2012-12-13 12:55:33

2Gareen wrote:

Приветствую всех. Есть вопрос: можно ли задать id объекту на карте(маркер, полигон) и получать его при клике по объекту? Это нужно для автоматической подгрузки текста в popup. Заранее благодарю за помощь.

new L.marker(
  new L.LatLng(LAT, LNG),
  {
    id: 1
  })

https://github.com/ssouk/Leaflet/commit/155557

оно?

vvoovv · 2012-12-13 15:14:18

2Gareen wrote:

Приветствую всех. Есть вопрос: можно ли задать id объекту на карте(маркер, полигон) и получать его при клике по объекту? Это нужно для автоматической подгрузки текста в popup. Заранее благодарю за помощь.

Любому javascript-объекту можно задать любое свойство.

Ia_Alex · 2012-12-13 15:54:58

vvoovv wrote:

2Gareen wrote:
Приветствую всех. Есть вопрос: можно ли задать id объекту на карте(маркер, полигон) и получать его при клике по объекту? Это нужно для автоматической подгрузки текста в popup. Заранее благодарю за помощь.
Любому javascript-объекту можно задать любое свойство.

а такой вот к вам вопрос - мне необходимо двигать на карте popup!....но я так понимаю в этой билиотеке нет достпуа к DOM popup, так как не получилось отловить событие на нём-просто ничего не происходит!...что можно сделать в данном случае?
Заранее спасибо.

Last edited by Ia_Alex (2012-12-13 15:55:13)

freeExec · 2012-12-14 07:48:08

Ну можно же пробежаться по всему ДОМу и найти

classList ->
0 "leaflet-popup"
1 "leaflet-zoom-animated"

2Gareen · 2012-12-14 11:51:18

msTi wrote:

new L.marker(
  new L.LatLng(LAT, LNG),
  {
    id: 1
  })
https://github.com/ssouk/Leaflet/commit/155557
оно?

Да, msTi, спасибо, оно. Теперь осталось разобраться с динамической подрузкой контента в popup. Отсюда ещё один вопрос: можно ли при объявление элемента привязать к нему javascript, который бы срабатывал на событие (в моем случае onClick)? И снова заранее благодарю

Last edited by 2Gareen (2012-12-14 12:11:11)

AndreyCool · 2012-12-14 13:46:58

метод unbindPopup определен только для маркеров? как от балуна избавиться у других объектов?

Ia_Alex · 2012-12-14 15:55:47

freeExec wrote:

Ну можно же пробежаться по всему ДОМу и найти
classList ->
0 "leaflet-popup"
1 "leaflet-zoom-animated"

их я нахожу.....но ничего с ними делать не могу( такое ощущение что popup находится под другим слоем!:o

msTi · 2012-12-17 06:49:58

2Gareen wrote:

Да, msTi, спасибо, оно. Теперь осталось разобраться с динамической подрузкой контента в popup. Отсюда ещё один вопрос: можно ли при объявление элемента привязать к нему javascript, который бы срабатывал на событие (в моем случае onClick)? И снова заранее благодарю

на ".on click" маркера вешаем код

Usage example
If you want to just bind a popup to marker click and then open it, it's really easy:
marker.bindPopup(popupContent).openPopup();

значение переменной popupContent определяется при клике по маркеру.

vvoovv · 2012-12-17 18:20:02

Просмотрел все события объекта карты, но так и не нашел события типа center_changed или bounds_changed.

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

PaulKaz · 2012-12-17 19:30:34

vvoovv wrote:

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

Для центра карты:

map.on('moveend', function(e) {
    alert(e.latlng);
});

Announcement

#201 2012-09-28 20:17:45

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#202 2012-09-29 18:46:07

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#203 2012-09-29 18:54:48

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#204 2012-10-04 19:13:42

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#205 2012-11-04 16:24:37

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#206 2012-11-15 12:28:52

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#207 2012-11-16 11:15:12

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#208 2012-11-22 10:27:40

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#209 2012-11-22 14:21:30

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#210 2012-11-22 15:32:45

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#211 2012-12-06 13:45:51

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#212 2012-12-12 06:53:34

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#213 2012-12-12 10:36:17

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#214 2012-12-12 12:11:30

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#215 2012-12-13 10:50:27

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#216 2012-12-13 12:55:33

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#217 2012-12-13 15:14:18

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#218 2012-12-13 15:54:58

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#219 2012-12-14 07:48:08

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#220 2012-12-14 11:51:18

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#221 2012-12-14 13:46:58

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#222 2012-12-14 15:55:47

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#223 2012-12-17 06:49:58

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#224 2012-12-17 18:20:02

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

#225 2012-12-17 19:30:34

Re: Leaflet — новая JavaScript-библиотека для карт от CloudMade

Board footer