Эффекты и анимация с помощью маркеров Google Maps

Question

Я хотел бы знать, как создавать эффекты / анимацию с помощью маркеров Google Maps.В частности, я хотел бы увеличить / уменьшить или «исчезнуть» маркер через определенный промежуток времени.Возможно ли это с помощью HTML5?Есть ли какая-либо библиотека эффектов jquery для этого?

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

Заранее спасибо

Answer 1

Я не видел ни одной библиотеки, чтобы сделать это, и в API нет функциональности для исчезновения маркеров, скажем.

Вместо этого вы можете имитировать маркеры, создавая собственное пользовательское наложение , которое выглядит как маркер. Пользовательский оверлей обычно содержит div, который вы можете легко контролировать прозрачность использования JavaScript / jQuery на основе класса или идентификатора, который вы назначаете во время создания пользовательского оверлея.

Например, если вы посмотрите на эту страницу, вы можете увидеть, что это кнопка, используемая для переключения видимости, вы можете так же легко изменить этот JavaScript, чтобы контролировать непрозрачность чего-либо.

Answer 2

Я смотрю на что-то подобное. Если вы установите опцию маркера 'optimized: false' для всех маркеров, каждый из которых будет иметь свой собственный элемент, вы можете использовать jQuery, чтобы выбрать все маркеры на вашей карте, используя что-то вроде $ ('# map_canvas img [src *) = "filename"] '), при условии, что вы используете пользовательские изображения для маркеров.

То, к чему это не относится, относится к каждому элементу в массиве, возвращаемому определенному маркеру. Я думаю, что вы можете добавлять маркеры на карту по одному, перезапускать селектор jquery и сравнивать возвращаемые элементы с предыдущим, чтобы увидеть, какой элемент был новым. Я не проверял эту часть (у меня есть то, что я говорю в первом абзаце), так как я работаю над чем-то немного другим.

После этого вы сможете напрямую настроить непрозрачность / размер изображения. Это может стать неуклюжим для большого количества маркеров.

---

Абзац второй выше глуп.

Добавьте маркер на карту, убедившись, что установлена ​​опция optimized: false. то

var freshlyAddedMarkerImage = $('#map_canvas img[src*="your_marker_icon"][class!="adjustMe"]');

Вновь добавленный маркер не будет иметь класс, поэтому будет выбран единственный элемент. Перед установкой className вы можете установить идентификатор, добавить элемент в массив в той же позиции индекса, в которой соответствующий маркерный объект содержится в другом массиве и т. Д.

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

Полагаю, если бы вы знали, что существуют группы маркеров, которые будут совместно использовать одно и то же преобразование (масштабирование / затухание) из-за того, что они одного возраста или любого другого, то вы могли бы добавить их все и выбрать только jQuery на конец, прежде чем перебирать возвращаемые элементы, устанавливая класс, который позволит вам настроить их в массовом порядке.