OpenLayers: вынос контроллеров за пределы карты

Решенные задачи, первая запись - описание решения.
Ответить
Аватара пользователя
Mavka
Гуру
Сообщения: 2060
Зарегистрирован: 14 мар 2008, 17:36
Статьи: 11
Проекты: 2/1
Репутация: 9

OpenLayers: вынос контроллеров за пределы карты

Сообщение Mavka » 10 ноя 2010, 10:35

MousePosition, LayerSwitcher, OverviewMap и др.
Для большинства информационных контроллеров существует стандартный метод - при создании в options указать аттрибут div. Пусть на странице есть два элемента div, один для карты, второй для контроллера:

Код: Выделить всё

<body>
    <div id="map"></div>
    <div id="info"></div>
</body> 
Указываем их при создании карты:

Код: Выделить всё

map = new OpenLayers.Map('map', {
    div: $('map'),
    controls: [
        new OpenLayers.Control.MousePosition({div: $('info')})
    ]
}); 
Для карты (map) указывать div не обязательно, она сама найдет элемент с id='map'.

Scale
Элемент div указывается отдельно, вне общего блока параметров:

Код: Выделить всё

new OpenLayers.Control.Scale('scale', {geodesic: true}) 
Permalink
Нужен не div, а ссылка на тэг <a>:

Код: Выделить всё

<a href="" id="perm">Постоянная ссылка</a>
new OpenLayers.Control.Permalink('perm') 
лангольеры под окном жрали время ом-ном-ном

Аватара пользователя
Denis Rykov
Гуру
Сообщения: 3321
Зарегистрирован: 11 апр 2008, 21:09
Статьи: 33
Проекты: 9
Репутация: 494
Ваше звание: Author
Контактная информация:

Re: OpenLayers: вынос контроллеров за пределы карты

Сообщение Denis Rykov » 12 ноя 2010, 10:05

Отличная инструкция! Меня вот что смущает - почему в API OpenLayers не описан параметр div для контролов наряду с остальными параметрами, а всего лишь вставлено замечание "it is possible to add a control to an external div by passing the div in the options parameter". Почему бы просто не добавить div в список доступных свойств контролов. Или тут есть какая-то логика?

И еще, в файле style.css описан, например, класс div.olControlMousePosition. А в каком именно месте происходит создание объекта div.olControlMousePosition? И могу ли я как-то вставлять свой текст в объект map на подобии того как это делает контрол MousePosition?
Spatial is now, more than ever, just another column- The Geometry Column.

Аватара пользователя
Mavka
Гуру
Сообщения: 2060
Зарегистрирован: 14 мар 2008, 17:36
Статьи: 11
Проекты: 2/1
Репутация: 9

Re: OpenLayers: вынос контроллеров за пределы карты

Сообщение Mavka » 12 ноя 2010, 10:21

Обнаружил интересную штуку. Идем на dev.openlayers.org. Смотрим:
  1. API documentation
  2. Developer Documentation
Тысяча чертей!!! По второму пункту гораздо более полная информация. Сравните: лажа и классный хабр. Дьявол, меняю ссылки в закладках. На^W^W Зачем они так сделали?

Если 'div' не задан, то он создается или при инициализации (некоторые контроллеры) или в классе-прародителе в методе draw при первом появлении на экране (в частности MousePosition). Чтобы добавить текст на карту нужно создать свой div (например, с помощью OpenLayers.Util.createDiv), задав абсолютное позиционирование. Возможно, придется поиграть с z-индексом, что бы быть на самом верхнем уровне.
лангольеры под окном жрали время ом-ном-ном

Аватара пользователя
Denis Rykov
Гуру
Сообщения: 3321
Зарегистрирован: 11 апр 2008, 21:09
Статьи: 33
Проекты: 9
Репутация: 494
Ваше звание: Author
Контактная информация:

Re: OpenLayers: вынос контроллеров за пределы карты

Сообщение Denis Rykov » 12 ноя 2010, 13:00

Точно! А я оказывается всё это времся использовал этот лажовый док из первого пункта. Более того, если зайти на страницу, то в разделе OpenLayers JavaScript API Documentation можно увидеть 4 разные ссылки на API.
Spatial is now, more than ever, just another column- The Geometry Column.

Аватара пользователя
Denis Rykov
Гуру
Сообщения: 3321
Зарегистрирован: 11 апр 2008, 21:09
Статьи: 33
Проекты: 9
Репутация: 494
Ваше звание: Author
Контактная информация:

Re: OpenLayers: вынос контроллеров за пределы карты

Сообщение Denis Rykov » 03 дек 2010, 11:05

Mavka писал(а):Чтобы добавить текст на карту нужно создать свой div (например, с помощью OpenLayers.Util.createDiv), задав абсолютное позиционирование. Возможно, придется поиграть с z-индексом, что бы быть на самом верхнем уровне.
Так точно, а чтобы добавить div на карту, нужно воспользоваться методом appendChild:

Код: Выделить всё

var progressBar = OpenLayers.Util.createDiv("progress-bar",new OpenLayers.Pixel(50,10),new OpenLayers.Size(56,21),"./images/ajax-loader.gif",null,null,null,null);
progressBar.style.zIndex = 2000;
progressBar.style.visibility = "hidden";
map.div.appendChild(progressBar); 
Spatial is now, more than ever, just another column- The Geometry Column.

Аватара пользователя
Denis Rykov
Гуру
Сообщения: 3321
Зарегистрирован: 11 апр 2008, 21:09
Статьи: 33
Проекты: 9
Репутация: 494
Ваше звание: Author
Контактная информация:

Re: OpenLayers: вынос контроллеров за пределы карты

Сообщение Denis Rykov » 06 окт 2011, 06:31

Функция $() - я так понимаю аналог document.getElementById(), а собственно $() - где описана?
Spatial is now, more than ever, just another column- The Geometry Column.

Аватара пользователя
dobeer
Активный участник
Сообщения: 199
Зарегистрирован: 25 дек 2009, 21:54
Репутация: 1
Откуда: Чита
Контактная информация:

Re: OpenLayers: вынос контроллеров за пределы карты

Сообщение dobeer » 06 окт 2011, 10:03

Думаю она описана в Prototype JavaScript Framework, который включен в библиотеку OL. С Prototype не приходилось общаться но насколько я понимаю она схожа с библиотекой JQuery, и там есть аналогичная функция, своего рода обертка для объектов. document.getElementById() только выберает элемент по его id, а функции $() можно передавать различные CSS-селекторы и получитьобъект всех элементов HTML попадающих под критерий и далее работать с ними с помощью различных методов объекта.

Аватара пользователя
Denis Rykov
Гуру
Сообщения: 3321
Зарегистрирован: 11 апр 2008, 21:09
Статьи: 33
Проекты: 9
Репутация: 494
Ваше звание: Author
Контактная информация:

Re: OpenLayers: вынос контроллеров за пределы карты

Сообщение Denis Rykov » 06 окт 2011, 10:08

Похоже Prototype тут не причём, в Util.js нашлось:

Код: Выделить всё

if(typeof window.$  === "undefined") {
    window.$ = OpenLayers.Util.getElement;
} 
Spatial is now, more than ever, just another column- The Geometry Column.

Ответить

Вернуться в «Рецепты»