Заменить маркеры на содержание HTML

Question

Я искал в документации по Google Map API V3, но не смог найти способ использовать собственный HTML-контент вместо изображения для создания пользовательского значка на карте.Я хотел бы отобразить динамический маркер, который может отображать текст или все, что я хочу.

Например:

    <div class="marker">Dynamic text</div>

Я видел эту тему Карта Google API v3: можно ли использовать div вместо изображения для создания пользовательского значка? гдекто-то советует использовать «Пользовательские оверлеи», но в документации он отображает только изображение ... Я не вижу смысла объяснять, как отображать изображение с помощью «Пользовательских оверлеев», если это делается для отображения HTML-контента.http://code.google.com/apis/maps/documentation/javascript/overlays.html#CustomOverlays

Как мне поступить тогда?Должен ли я использовать пользовательские оверлеи?Нет ничего проще, чем кажется?

Answer 1

У Мано правильный ответ, если вы хотите разместить на карте что-либо, не ограниченное географически, например меню или заголовок.

Если вы хотите отобразить что-то географически привязанноекак название города (на секунду притворяясь, что API этого еще не сделал), чем вы будете возглавлять маршрут CustomOverlay.Хотя во всех примерах используются изображения, это не является обязательным условием.Если вы посмотрите на пример простого наложения и посмотрите исходный код в строке 62, вы увидите точные строки, добавляющие объект <img> к <div>.Вы можете так же легко добавить текст в div вместо изображения.

Answer 2

На самом деле вы можете использовать float div на вашей карте, используя CSS.Вы должны быть осторожны с позиционированием.Проверьте это сообщение: div поверх div с Google Maps API

Answer 3

Перейти на этот демонстрационный веб-сайт: http://easysublease.org/mapcoverjs/

На карте щелкните правой кнопкой мыши на карте, и вы увидите контекстное меню. В этом контекстном меню есть вход, вы можете просто ввести текст для ввода. Тогда у следующего сгенерированного маркера будет текст, который вы там ввели.

Чтобы увидеть, как это работает, вы можете перейти к его github: https://github.com/bovetliu/mapcover.

Mapcover.js - это один гаджет javascript, позволяющий разработчикам писать HTML / CSS для создания пользовательских элементов на карте Google.