Клуб API Карт

Dom-элемент слоя

nolan23
22 ноября 2015, 19:19

Есть задачка динамически изменять прозрачность кастомных тайловых слоев - что-то типа тайм-лапса из нескольких слоев.

для этого надо каждые n  секунд делать opacity определенного слоя 1, а остальных - 0. потом следующий слой и так в цикле.

Самое простое - это использовать css. Вот только для DOM-элемента слоя добраться невозможно (или я не там ищу).

Сейчас использую суперизврат - слою даю zIndex равным id слоя + 1000 и при добавлении на карту ищу среди детей элемента pane

$(this.getPane().getElement()).children().each( function() {
   if ($(this).css('zIndex') == (context.properties.get('id') + 1000)) {
       $(this).attr('data-layer',  context.properties.get('id'));
   }
});
мечтаю о менее извращенном методе))

 

 

4 комментария
Подписаться на комментарии к посту

Возможно разработчики что-то проще посоветуют...

Я бы перекрыл у слоя getTileUrl и возвращал из него dataURL

Вы можете через этот метод сами загружать тайлы, хранить, и модифицировать (делать их прозрачными) с помощью канвас.

В приложении тайлы слоя вырезаются из исходного изображения, ползунок смены прозрачности и цвета фона вызывает update слоя и перерисовку тайлов.

Правда не уверен тут насчет производительности для вашего "каждые n секунд в цикле", может тормозить

да не то слово! зачем перерисовывать канвас, когда его (или его контейнер) просто прячем с помощью css. более того, можно красиво сделать через transform

 

Да понятно, но задокументированного интерфейса нет. Смотрите исходники )

Тебе надо включать/выключать слои через прозрачно, или плавно менять их прозрачность?