在 Google Maps SDK 上标记 Android

Question

我想在地图上的某些地方放置我自己的自定义标签，例如下图，其中有与地点标记无关的阿尔伯特公园湖文本。这是我想做的事情的一个例子，因为我正在设计一个有多个区域的应用程序，我想把这些区域的名称放在地图上，这些名称只在某些缩放级别可见，以确保有用户查看时没有混乱。我曾尝试过放置标记，但发现标记顶部的文本看起来很糟糕，我将不得不编写一个函数来调整缩放级别的文本可见性，以处理屏幕上的许多混乱情况一次。

干杯乔丹·史密斯

Answer 1

以下是您可以尝试的一些方法：

1。弹出多个信息窗口：https://jsfiddle.net/kjqfs0bo/

function initMap() {
  const uluru = { lat: -25.363, lng: 131.044 };
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 4,
    center: uluru,
  });
  const contentString ="lalala";
  const infowindow = new google.maps.InfoWindow({
    content: contentString,
  });
  const infowindow2 = new google.maps.InfoWindow({
    content: contentString,
  });
  const marker = new google.maps.Marker({
    position: uluru,
    map,
    title: "Uluru (Ayers Rock)",
  });
  const marker2 = new google.maps.Marker({
    position: { lat: -20.363, lng: 130.044 },
    map,
    title: "Uluru (Ayers Rock)",
  });
    infowindow.open(map, marker);
    infowindow2.open(map, marker2);
}

2。带有文本标签的隐形标记：https://jsfiddle.net/0koynbz2/1/

function createMarker() {
  var canvas, context;
  canvas = document.createElement("canvas");
  return canvas.toDataURL();
}

var map = new google.maps.Map(document.getElementById("map_canvas"), {
  zoom: 13,
  center: new google.maps.LatLng(56.1304, -106.3468),
  mapTypeId: google.maps.MapTypeId.ROADMAP
});

var marker = new google.maps.Marker({
  position: new google.maps.LatLng(56.1304, -106.3468),
  map: map,
  icon: {
    url: createMarker()
  },
  label: {
    text: 'My Place',
    color: '#000',
    fontSize: '14px',
    fontWeight: 'bold'
  }
});
var marker2 = new google.maps.Marker({
  position: new google.maps.LatLng(56.1204, -106.3468),
  map: map,
  icon: {
    url: createMarker()
  },
  label: {
    text: 'My Place2',
    color: '#000',
    fontSize: '14px',
    fontWeight: 'bold'
  }
});

3。也许试试 geojson，但因为 geojson 只支持点、线和多边形。我不确定是否有办法只显示文本。

Answer 2

我建议将要设置的文本转换为位图图像并将此位图设置为自定义标记，如果您想知道如何将文本转换为位图，您可能会发现这个question很有用。