Google Maps API v3标记是否带有图片以及该图片上方的文字? [英] Google Maps API v3 marker with image and a text on top of this image?

问题描述

我想在标记上显示图像，但我还要在该图像上放置一些文本(我需要在应用程序的生命周期中动态更改).

I'd like to display an image on a marker but on this image I'd like to also place some text (that I need to change dynamically during the life cycle of my application).

我尝试了 markerwithlabel ，它们有两个不同的示例，其中有一个图片以及带有文本的另一个，但是我想将两者结合起来以创建类似于以下内容的东西:

I've tried markerwithlabel and they have two different examples, one with a picture and another with text but I'd like to combine the two to create something similar to this:

呜呜呜呜呜呜呜呜呜呜呜呜呜呜呜呜呜呜！应该被指定(并且可以更新)为文本.

Where "Wheeee!" should be specified (and be updatable) as text.

我该如何实现?

推荐答案

您可以使用 RichMarker Google Maps Api库中的a>.您可以将任何HTML添加到标记(如示例此处).

You can use RichMarker from Google Maps Api Libraries. You can add any HTML to your marker (as showin in the example here).

因此，在您的情况下，请使用RichMarker.setContent()(Api参考此处)，您将添加自定义HTML，例如(大致来自您提供的图片示例):

So in your case, using RichMarker.setContent() (Api reference here) you would add custom HTML, something like (roughly, from your provided picture example):

myMarker.setContent('<div class="callout_bubble">
                       <i class="some_icon"></i>
                       <span class="inside_text" id="my_marker_X_text">Wheee!</span>
                     </div>');

然后添加css样式以任意方式对其进行样式设置.您也可以使用js更改ID为my_marker_X_text的<span>内的文本.如果您想要多个标记，只需为它们分配多个唯一的ID，或者始终更改标记的全部内容，这取决于您.

And then add css styles to style it any way you want. Also you can change text inside <span> with id my_marker_X_text using js. If you want multiple markers just assign them multiple unique ids, or always change whole content of marker, that's up to you.

这篇关于Google Maps API v3标记是否带有图片以及该图片上方的文字?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！