我如何更改集群图标?我wolud喜欢有相同的图标,其他颜色不是蓝色。Google Maps Api v3,自定义集群图标
回答
你需要初始化MarkerClusterer对象时使用样式参数 - 下面的代码显示了默认样式,所以如果你想recolour的一个图标只是改变了相关网址,以你的形象......
//set style options for marker clusters (these are the default styles)
mcOptions = {styles: [{
height: 53,
url: "http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m1.png",
width: 53
},
{
height: 56,
url: "http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m2.png",
width: 56
},
{
height: 66,
url: "http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m3.png",
width: 66
},
{
height: 78,
url: "http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m4.png",
width: 78
},
{
height: 90,
url: "http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m5.png",
width: 90
}]}
//init clusterer with your options
var mc = new MarkerClusterer(map, markers, mcOptions);
这些图标不再在谷歌服务器上。
他们改变回购git枢纽这里是icone https://github.com/googlemaps/js-marker-clusterer/tree/gh-pages/images – jayesh 2016-05-12 12:00:54
@Kaippally我已经在以下SO帖子中介绍了这个解决方案[google markerclusterer.js库的备用源路径是什么?](http://stackoverflow.com/a/37183674/1301937) – 2016-05-12 20:28:16
谷歌改变了他的回购。最新的群集回购是:https://github.com/googlemaps/js-marker-clusterer 图像:https://github.com/googlemaps/js-marker-clusterer/tree/gh-pages/images
您也可以考虑下载源代码,并从本地路径给出链接。通过这种方式,您可以更好地控制应用程序所需的资源。
local_path "/pucblic/"
mcOptions = {styles: [{
height: 53,
url: local_path+"m1.png",
width: 53
},
{
height: 56,
url: local_path+"m2.png",
width: 56
},
{
height: 66,
url: local_path+"m3.png",
width: 66
},
{
height: 78,
url: local_path+"m4.png",
width: 78
},
{
height: 90,
url: local_path+"m5.png",
width: 90
}]}
快捷方式是压倒像这样的图像路径:
MarkerClusterer.prototype.MARKER_CLUSTER_IMAGE_PATH_ =
"https://raw.githubusercontent.com/googlemaps/v3-utility-library/master/markerclustererplus/images/m";
上面的图像路径不正确https://raw.githubusercontent.com/googlemaps/v3-实用程序库/主/ markerclustererplus /图像/ m1.png – 2016-05-29 03:49:41
真棒解决方案,只需使用本地路径,而不是原始github内容url。 – phaberest 2016-11-17 14:38:55
这里是原始照片
markerClusterOptions = {styles: [{
height: 53,
url: "https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m1.png",
width: 53
},
{
height: 56,
url: "https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m2.png",
width: 56
},
{
height: 66,
url: "https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m3.png",
width: 66
},
{
height: 78,
url: "https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m4.png",
width: 78
},
{
height: 90,
url: "https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m5.png,
width: 90
}]}
markerCluster = new MarkerClusterer(map, markers,markerClusterOptions);
- 1. Google Maps Api v3,自制集群图标
- 2. Google Maps Api v3 - 如何删除群集图标?
- 3. Google Maps API v3自定义按钮
- 4. Google Maps API v3通过自定义图像叠加标记?
- 5. Google Maps API v3 - 自定义多色图标
- 6. Google Chrome中的Google Maps API v3自定义光标的热点
- 7. Google Maps Api v3自定义InfoWindow - “google未定义”错误
- 8. Google Maps Api v3自定义InfoWindow - “google未定义”错误
- 9. Google Maps API V3:从群集中排除单个标记
- 10. Google Maps API V3:简单标记群集未显示
- 11. Google Maps API v3街景“google未定义”
- 12. Google Maps Api标记群集激活?
- 13. Google Maps API v3 - 自定义标记没有出现
- 14. Google Maps v3 API和WordPress ACF:多个自定义标记
- 15. Google Maps API v3 - 自定义行车路线标记
- 16. Google Maps API v3自定义动画标记
- 17. Google Maps V3自定义工具提示
- 18. Google Maps API v3:地形地图的自定义样式
- 19. 带有自定义图标的Google Maps API V3的多个标记
- 20. 如何使用Google Maps API v3的自定义图标创建标记?
- 21. Google Maps API v3 - 未定义GIcon
- 22. Google maps api v3默认图标?
- 23. Google Maps API v3添加地图标记
- 24. Google Maps API自定义标记
- 25. 带Google Adsense的Google Maps API V3自定义控件?
- 26. react-google-maps自定义标记图标
- 27. Google Maps API v2 vs Google Maps API v3?
- 28. 使用缩放调整自定义图像标记大小 - Google Maps API v3
- 29. Google Maps V3 - directionService未定义
- 30. google-maps-api-v3 getProjection
看起来像有逗号的失踪为每个标记的属性列表...来自FireFox'错误:在属性列表后缺少}。 – 2011-09-14 02:08:36