Карты Google: как добавить элементы HTML к определенным координатам?

Я хотел бы знать, как и можно ли добавить стандартные элементы HTML (div, button) к определенному набору координат на карте?

Например, у меня есть набор координат, и я хотел бы прикрепить к ним собственное всплывающее уведомление.

Карты Google с элементом пользовательского стиля, прикрепленным к набору координат

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

Возможно ли это сделать с помощью Google Maps?


google-maps javascript overlay google-maps-markers
person Cristian Toma    schedule 27.01.2010    source источник

Ответы (5)


arrow_upward
5
arrow_downward

вы можете использовать пользовательские наложения — https://developers.google.com/maps/documentation/javascript/customoverlays для этого

person roman    schedule 27.01.2010
comment
Это именно то, что я искал! Большое спасибо ! - person Cristian Toma; 28.01.2010
comment
Требуется ли свойство bounds для всех наложений? Можно ли центрировать наложение по одной паре координат широта + долгота (т.е. от маркера)? - person o01; 15.11.2011

arrow_upward
3
arrow_downward

Как сказал Роман, вы можете создать собственный объект javascript, который реализует GOverlay.

Вот пример из другого С.О. вопрос, где парень хотел вставить SVG поверх карты Google. Однако я почти уверен, что вы могли бы использовать его решение, чтобы просто вставить HTML.

Как наложить диаграммы SVG на Карты Google?

person jessegavin    schedule 27.01.2010

arrow_upward
1
arrow_downward

Если вы хотите сделать собственный воздушный шар, см. этот вопрос:

Шаблоны всплывающих окон Карт Google

person Chris B    schedule 27.01.2010
comment
Я не хочу отображать только окна уведомлений (пузыри). Благодарю вас ! - person Cristian Toma; 28.01.2010

arrow_upward
0
arrow_downward

Вам следует обратить внимание на функцию openInfoWindowHtml. . Сначала вам потребуется добавить на карту маркер. Посмотрите этот пример в Google, чтобы убедиться в этом. , в сочетании с отличной функцией максимизации.

person Sean Vieira    schedule 27.01.2010
comment
Что мне нужно, так это добавить простой элемент HTML к некоторым координатам на карте, а не в собственном окне уведомлений Google Maps. Благодарю вас ! - person Cristian Toma; 28.01.2010

arrow_upward
-1
arrow_downward

См. это в качестве базового класса для последней версии Google Maps API (v3):

Применение:

var rectBounds = new google.maps.LatLngBounds(
    new google.maps.LatLng(54.478490, 18.550357),
    new google.maps.LatLng(54.478434, 18.551952)
);
var obj = new overlayText(rectBounds, 'Some<br />HTML', objGMap3);
person Nux    schedule 26.05.2010