谷歌地图标记与透明文本标签

Question

如何使用透明文字标签在Google地图上添加标记？

实施例： 带有天气覆盖图的Google地图具有透明背景的温度 标记的标签会动态更改。 Ex当温度变化时，标签也会发生变化。

Answer 1

试用MarkerWithLabel实用程序库。这是a demo

最低要求是CSS样式。

.labels {
  color: red;
  background-color: transparent;
  font-family: "Lucida Grande", "Arial", sans-serif;
  font-size: 10px;
  font-weight: bold;
  text-align: center;
  width: 100px;
  border: 0;
}

  var marker1 = new MarkerWithLabel({
    position: new google.maps.LatLng(0,-5),
    draggable: true,
    raiseOnDrag: true,
    map: map,
    labelContent: "Tina's transparent Marker With Label",
    labelAnchor: new google.maps.Point(50, 0),
    labelClass: "labels", // the CSS class for the label
    labelStyle: {opacity: 0.75}
  });

Answer 2

请，如果您只需要更改标签的不透明度，请不要使用库。

您可以使用：

let marker = new google.maps.Marker({
    position: myLatLng,
    map: map,
    label: {
        text: 'Hello World!',
        color: 'rgba(0, 0, 0, 0.5)',
    }
})