Использовать элемент HTML вместо значка для маркера карты с помощью gmap3?

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

Очень просто использовать пользовательское изображение, как в приведенном ниже примере документации, но кто-нибудь знает, могу ли я вместо этого использовать HTML?

  marker:{
    values:[
      {latLng:[48.8620722, 2.352047], data:"Paris !"},
      {address:varAddress1, data:varData1},
      {address:varAddress2, data:varData2, options:{icon: "http://maps.google.com/mapfiles/marker_green.png"}}
    ],
  ...

обновление: упомянутый возможный дубликат использует PHP для извлечения значков из великолепного шрифта SVG. Это очень ограничительно. Я действительно хотел бы иметь возможность использовать элемент HTML, если это возможно.


google-maps javascript font-awesome glyphicons jquery-gmap3
person JOATMON    schedule 17.11.2013    source источник
comment
возможный дубликат Использование шрифтов значков в качестве маркеров в Google Maps V3   -  person adeneo    schedule 18.11.2013
comment
О, очень приятно. Не знаю, почему я не нашел его. Спасибо.   -  person JOATMON    schedule 18.11.2013
comment
Подождите, эта библиотека использует файлы PHP для извлечения SVG. К сожалению, это останавливает шоу :( Кроме того, я, честно говоря, хотел бы что-то более гибкое, например HTML, вместо извлеченного SVG из определенной библиотеки.   -  person JOATMON    schedule 18.11.2013
comment
возможный дубликат значков Google Maps HTML   -  person JOATMON    schedule 19.11.2013
comment
Нашел вопрос, который является дубликатом и имеет ответ, который отлично решает мою проблему.   -  person JOATMON    schedule 19.11.2013

Ответы (2)


arrow_upward
2
arrow_downward

Оказывается, это удивительно легко! Вы заменяете «маркер» на «наложение», что позволяет вам делать следующее:

    overlay:{
        values: [
            { latLng: [38.55240, -90.41710], data: "PRINTER01", options: { content: "<div>Whatever you want here!</div>" }  },
            { address: "1234 E. Main Street, Springfield USA", data: "SERVER01", options: { content: "<div><i class='icon-reorder'></i></div>" } }
        ],
person JOATMON    schedule 17.11.2013

arrow_upward
1
arrow_downward

«richMarkers» от Google — гораздо лучшее решение.

http://google-maps-utility-library-v3.googlecode.com/svn/trunk/richmarker/

person JOATMON    schedule 19.11.2013