我如何在Google Maps V3中创建编号地图标记？ [英] How can I create numbered map markers in Google Maps V3?

问题描述

这些标记使用自定义图标，但我也想在顶部添加数字。我已经看到如何使用API​​的旧版本完成这项工作。我怎样才能在V3中做到这一点？

*注意 - 当鼠标悬停标记时，title属性会创建一个工具提示，但我希望能够在即使你没有将它悬停在自定义图像的顶部也是如此。

以下是marker类的文档，并且这些属性都没有帮助：

a href =http://code.google.com/apis/maps/documentation/v3/reference.html#MarkerOptions =noreferrer> http://code.google.com/apis/maps/documentation/ v3 / reference.html＃MarkerOptions

解决方案

不幸的是，这并不容易。您可以根据OverlayView类创建自己的自定义标记（示例），并把你自己的HTML，包括一个计数器。这会给你留下一个非常基本的标记，你不能拖动或添加阴影很容易，但它是非常可定制的。

或者，你可以将标签添加到默认标记。这将是较少的定制，但应该工作。它还保留了标准标记所有有用的东西。

com / apis / maps / articles / mvcfun.htmlrel =noreferrer>有趣的MVC对象。

编辑：如果你不想要要创建JavaScript类，您可以使用 Google的Chart API 。例如：

编号标记：

  http：//图表.apis.google.com / chart？chst = d_map_pin_letter& chld = 7 | FF0000 | 000000 
  

文字marker：

  http：//chart.apis.google.com/chart？chst = d_map_spin& chld = 1 | 0 | FF0000 | 12 | _ | foo 
  

这是一条快速简单的路线，但它的定制性较差，需要客户端为每个标记下载新图像。

I'm working on a map that has multiple markers on it.

These markers use a custom icon, but I'd also like to add numbers on top. I've seen how this has been accomplished using older versions of the API. How can I do this in V3?

*Note -- the "title" attribute creates a tooltip when you mouseover the marker, but I want something that will be layered on top of the custom image even when you're not hovering on top of it.

Here's the documentation for the marker class, and none of these attributes seem to help: http://code.google.com/apis/maps/documentation/v3/reference.html#MarkerOptions

解决方案

Unfortunately it's not very easy. You could create your own custom marker based on the OverlayView class (an example) and put your own HTML in it, including a counter. This will leave you with a very basic marker, that you can't drag around or add shadows easily, but it is very customisable.

Alternatively, you could add a label to the default marker. This will be less customisable but should work. It also keeps all the useful things the standard marker does.

You can read more about the overlays in Google's article Fun with MVC Objects.

Edit: if you don't want to create a JavaScript class, you could use Google's Chart API. For example:

Numbered marker:

http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=7|FF0000|000000

Text marker:

http://chart.apis.google.com/chart?chst=d_map_spin&chld=1|0|FF0000|12|_|foo

This is the quick and easy route, but it's less customisable, and requires a new image to be downloaded by the client for each marker.

这篇关于我如何在Google Maps V3中创建编号地图标记？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！