首页 > 解决方案 > 如何将标签添加到谷歌地图标记?(错误:InvalidValueError:setLabel:不是字符串;并且没有文本属性)

问题描述

我想根据我的 GPS 位置数为谷歌地图标记添加标签。我在我的数据库中获取了我的数据,我可以在我的地图中添加标记,但我无法在标记内添加标记。

for(var i = 0; i < data.length; i++) {
   var coords = data[i].GPSCoordinates.split(',');
   var position = new google.maps.LatLng(coords[0], coords[1]);
   var labels = i + 1;
   addMarker(position, map, labels);
}

function addMarker(location, map, label) {
   var marker = new google.maps.Marker({
       position: location,
       map: map,
       label: label
   });
}

标签: javascriptgoogle-mapsgoogle-maps-api-3

解决方案


我的代码出现 javascript 错误:InvalidValueError: setLabel: not a string; and no text property. 分配给label属性的值 必须是字符串(或MarkerLabel匿名对象)。该代码当前正在分配一个数字。改变:

var labels = i + 1;

到:

var labels = ""+ (i + 1);

概念证明小提琴

结果地图的屏幕截图

代码片段:

function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1660756),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  var data = [{GPSCoordinates: "37.4419, -122.1419"},
    {GPSCoordinates: "37.4529598, -122.1817252"},
    {GPSCoordinates: "37.4335499, -122.2030209"},
    {GPSCoordinates: "37.424106, -122.1660756"}
  ]
  for (var i = 0; i < data.length; i++) {
    var coords = data[i].GPSCoordinates.split(',');
    var position = new google.maps.LatLng(coords[0], coords[1]);
    var labels = "" + (i + 1);
    addMarker(position, map, labels);
  }

  function addMarker(location, map, label) {
    var marker = new google.maps.Marker({
      position: location,
      map: map,
      label: label
    });
  }
}
google.maps.event.addDomListener(window, "load", initialize);
html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas"></div>


推荐阅读