6

我正在尝试在我的标记上添加一个字母，然后有多个带有字母的标记（准确地说是 14 个）。到目前为止，我一直没有成功。我是一个完整的新手，有代码和谷歌 API。

你能告诉我需要添加什么代码以及在哪里添加吗？

下面是我的代码：

<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=....
  type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
function load() {
  if (GBrowserIsCompatible()) {

    var map = new GMap2(document.getElementById("map"));
    map.addControl(new GMapTypeControl());
    map.addControl(new GLargeMapControl());
    map.addControl(new GOverviewMapControl());
    map.addControl(new GScaleControl());


    var bounds = map.getBounds();
    var southWest = bounds.getSouthWest();
    var northEast = bounds.getNorthEast();
    var lngSpan = northEast.lng() - southWest.lng();
    var latSpan = northEast.lat() - southWest.lat();
    for (var i = 0; i < 10; i++) {
    var point = new GLatLng(southWest.lat() + latSpan * Math.random(),
        southWest.lng() + lngSpan * Math.random());
    map.addOverlay(new GMarker(point));

    var point = new GLatLng(lat,ling);
    map.setCenter(point, 10);
    var marker = new GMarker(point);
    map.addOverlay(marker);

}

   GEvent.addListener(map, "moveend", function() {
   var center = map.getCenter();
   document.getElementById("message").innerHTML = center.toString();
   });



    map.setCenter(new GLatLng(lat,ling), 7);

  }
}
//]]>
</script>
<style type="text/css">

场地位置

谢谢

4

4 回答 4

12

这是使用字母添加标记的代码。为所有标记运行循环，索引是每个标记位置

let letter = String.fromCharCode("A".charCodeAt(0) + index),
marker = new google.maps.Marker({
    map: this.map,
    position: latLongObj,
    icon: "http://maps.google.com/mapfiles/marker" + letter + ".png",
    animation: google.maps.Animation.DROP
});

这是地图标记图标的列表

于 2013-10-23T11:01:38.677 回答
10

使用 Charts API 生成标记：

http://code.google.com/apis/chart/docs/gallery/dynamic_icons.html#pins

于 2010-10-11T15:23:21.357 回答
8

如果您尝试更改标记本身，请查看http://googlemapsmarkers.com - 如果您使用他们的 URL 作为标记，您可以指定标记的外观：

http://googlemapsmarkers.com/v1/A/ff00ff/

于 2010-09-30T15:53:07.373 回答
4

label像这样定义标记对象时使用该选项：

   markerB = new google.maps.Marker({
        position: pointB,
        title: "point B",
        label: "B",
        map: map
    })

来自Google Maps JavaScript API V3 参考：

类型：字符串|MarkerLabel 向标记添加标签。标签可以是字符串，也可以是 MarkerLabel 对象。只会显示字符串的第一个字符。

function initMap() {
  var pointA = new google.maps.LatLng(51.2750, 1.0870),
    pointC = new google.maps.LatLng(50.8429, -0.1313),
    pointB = new google.maps.LatLng(51.5379, 0.7138),
    myOptions = {
      zoom: 7,
      center: pointA,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    },
    map = new google.maps.Map(document.getElementById('map-canvas'), myOptions),
    markerA = new google.maps.Marker({
      position: pointA,
      title: "point A",
      label: "AAA",
      map: map
    }),
    markerB = new google.maps.Marker({
      position: pointB,
      title: "point B",
      label: "B",
      map: map
    }),
    markerC = new google.maps.Marker({
      position: pointC,
      title: "point C",
      label: "C",
      map: map
    });
}

initMap();
html,
 body {
   height: 100%;
   margin: 0;
   padding: 0;
 }
 #map-canvas {
   height: 100%;
   width: 100%;
 }
<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>


<div id="map-canvas"></div>

这是Jsfiddle上的相同演示

于 2015-09-16T18:15:05.007 回答