css - 如何在 google map api 3 中更改标记的颜色

标签 css google-maps

我正在寻找一种解决方案来更改 API V3 中 Google map 中制造商的颜色。我想在鼠标悬停时更改制造商的颜色。如果有人得到解决方案,请发布它们,我将非常感激。提前致谢

最佳答案

您必须自定义标记属性并为此使用自定义标记和阴影图像。但这是在 Map API 2 中,对此深表歉意。

var normal_icon = new GIcon();
normal_icon.image = "images/google_marker_green.png";
normal_icon.shadow = "images/shadow-google_marker_green.png";
normal_icon.iconSize = new GSize(20.0, 34.0);
normal_icon.shadowSize = new GSize(38.0, 34.0);
normal_icon.iconAnchor = new GPoint(10.0, 17.0);
normal_icon.infoWindowAnchor = new GPoint(10.0, 17.0);

var hover_icon = new GIcon();
hover_icon.image = "images/google_marker_blue.png";
hover_icon.shadow = "images/shadow-google_marker_blue.png";
hover_icon.iconSize = new GSize(20.0, 34.0);
hover_icon.shadowSize = new GSize(38.0, 34.0);
hover_icon.iconAnchor = new GPoint(10.0, 17.0);
hover_icon.infoWindowAnchor = new GPoint(10.0, 17.0);

var lat="Your lat. point";
var long="Your long. point";

map = new google.maps.Map2(document.getElementById("map"));
map.setCenter(new google.maps.LatLng(lat, long), 15);
map.setUIToDefault();
var point = new GLatLng(lat,long);
var marker = new GMarker(point,normal_icon);
var message="Custom message";
GEvent.addListener(marker, "click", function() {
  map.openInfoWindowHtml(point, message);
});
map.addOverlay(marker);

function bindInfoWindow(marker, map, infoWindow, html) {
      google.maps.event.addListener(marker, 'mouseover', function() {
        marker.setIcon(hover_icon);
      });
      google.maps.event.addListener(marker, 'mouseout', function() {
        marker.setIcon(normal_icon);
      });
    }

您可以从 http://smmtn.com/sandbox/gmaps-marker-hover/ 中找到确切的示例

感谢和问候

哈什

关于css - 如何在 google map api 3 中更改标记的颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5350256/

相关文章:

Android MapView 未加载

jquery - 绝对位置 + <body> 相对位置

html - 位置:除非给出边界,否则绝对不起作用

javascript - 在谷歌地图上使用鼠标绘制多边形

javascript - 从谷歌地图中获取第一个地址段

angularjs - 在angularjs中使用ngMap模块es6类时,使用 'this'时 'places-auto-complete'未绑定(bind)到构造函数

javascript - 在移动设备上打开 Google map 的 InfoWindow

html - 显示表格单元格高度 100% 对齐图像底部

CSS:带面板的实心边框创建可滚动面板

JQuery css() 选择器从类中设置背景颜色