我见过很多类似的问题(这里,这里和这里),但他们都接受了不能解决我的问题的答案。我发现这个问题的最佳解决方案是StyledMarker库,它允许您定义标记的自定义颜色,但我不能让它使用默认标记(当您做谷歌地图搜索时得到的-中间有一个点),它似乎只是提供了一个字母标记,或一个特殊的图标。


当前回答

将路径改为chart.googleapis.com,否则SSL将无法工作

其他回答

你可以动态地请求图标图像从谷歌图表api与网址:

http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|FE7569

它看起来像这样:图像是21x34像素,针尖的位置是(10,34)

你还需要一个单独的阴影图像(这样它就不会重叠附近的图标):

http://chart.apis.google.com/chart?chst=d_map_pin_shadow

它看起来像这样:图像是40x37像素,针尖的位置(12,35)

当你构建你的MarkerImages时,你需要相应地设置大小和锚点:

    var pinColor = "FE7569";
    var pinImage = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|" + pinColor,
        new google.maps.Size(21, 34),
        new google.maps.Point(0,0),
        new google.maps.Point(10, 34));
    var pinShadow = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_shadow",
        new google.maps.Size(40, 37),
        new google.maps.Point(0, 0),
        new google.maps.Point(12, 35));

然后你可以添加标记到你的地图:

        var marker = new google.maps.Marker({
                position: new google.maps.LatLng(0,0), 
                map: map,
                icon: pinImage,
                shadow: pinShadow
            });

只需将“FE7569”替换为您需要的颜色代码。例如:

归功于Jack B Nimble的灵感;)

在ie浏览器中,ssl下不支持此解决方案。 在控制台可以看到错误如下: SEC7111: HTTPS安全因此受到损害, 解决方案:正如这里的一位用户建议的那样替换 chart.apis.google.com到chart.googleapis.com的URL路径,以避免SSL错误。

我用StyledMarker所能得到的最接近的东西是这个。

不过,中间的子弹并不像默认的子弹那么大。StyledMarker类只是构建这个url,并要求谷歌api创建标记。

从类使用示例使用“%E2%80%A2”作为你的文本,如:

var styleMaker2 = new StyledMarker({styleIcon:new StyledIcon(StyledIconTypes.MARKER,{text:"%E2%80%A2"},styleIconClass),position:new google.maps.LatLng(37.263477473067, -121.880502070713),map:map});

你需要修改StyledMarker.js来注释掉这些行:

  if (text_) {
    text_ = text_.substr(0,2);
  }

因为这将把文本字符串修剪为2个字符。

或者,你也可以创建自定义标记图像基于默认的一个你想要的颜色,并覆盖默认标记的代码,如:

marker = new google.maps.Marker({
  map:map,
  position: latlng,
  icon: new google.maps.MarkerImage(
    'http://www.gettyicons.com/free-icons/108/gis-gps/png/24/needle_left_yellow_2_24.png',
    new google.maps.Size(24, 24),
    new google.maps.Point(0, 0),
    new google.maps.Point(0, 24)
  )
});

将路径改为chart.googleapis.com,否则SSL将无法工作

你可以使用这段代码,它工作得很好。

 var pinImage = new google.maps.MarkerImage("http://www.googlemapsmarkers.com/v1/009900/");<br>

 var marker = new google.maps.Marker({
            position: yourlatlong,
            icon: pinImage,
            map: map
        });