地图图标仅显示我的信息窗口的第一个字符

时间:2016-03-17 16:06:08

标签: javascript c# google-maps

我将一串lat / lons传递给我的javascript crom aspx底层代码。地图显示正确,但是当您单击该引脚时,它只显示该引脚的第一个字符。

这是我的c#代码:

public string sdata;
protected void Page_Load(object sender, EventArgs e)
{
  sdata = "Fred,26.2486591339111,-80.2002334594727|Tom,26.2344417572021,-80.1393356323242|Paul,26.0818271636963,-80.2083358764648|John,26.2701854705811,-80.1152496337891|Eric,26.2009468078613,-80.1440734863281";
}

任何我的javascript:

  var data2 = '<%=sdata%>'.toString();
  var locations = data2.split('|');

  var loc = locations[0].split(",");
  var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 10,
      center: new google.maps.LatLng(loc[1],loc[2]),
      mapTypeId: google.maps.MapTypeId.ROADMAP
  });

  var infowindow = new google.maps.InfoWindow();

  var marker, i;

  var pinColor = "#";
  for (k = 0; k < 3; k++) {
      pinColor += ("0" + (Math.random() * 256 | 0).toString(16)).substr(-2);
  }

  var pinImage = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|" + "#0000ff",
              new google.maps.Size(21, 34),
              new google.maps.Point(0, 0),
              new google.maps.Point(10, 34));
  var pinShadow = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_shadow",
              new google.maps.Size(40, 37),
              new google.maps.Point(0, 0),
              new google.maps.Point(12, 35));

  for (i = 0; i < locations.length; i++) {
      var loc = locations[i].split(",");
      marker = new google.maps.Marker({
          position: new google.maps.LatLng(loc[1], loc[2]),
          //icon: pinImage,
          //shadow: pinShadow,
          map: map
      });

      google.maps.event.addListener(marker, 'click', (function (marker, i) {
          return function () {
              infowindow.setContent(locations[i][0]);
              infowindow.open(map, marker);
          }
      })(marker, i));
  }

我的分裂似乎工作正常:

enter image description here

这是我点击针脚时看到的内容:

enter image description here

我认为问题出在addListener(?)中,但我是javascript和google地图的新手。

有人有任何建议吗?

1 个答案:

答案 0 :(得分:1)

更新:解决澄清问题

你的问题是你在处理程序的for循环中提前进行逗号分割,但是在拉第一个元素时引用未分割的版本 - 因此你得到了字符串的第一个元素

  

“佛瑞德,26.2486591339111,-80.2002334594727”

  

“F”

您需要引用在循环开始时拆分的loc数组。

更改行:

google.maps.event.addListener(marker, 'click', (function (marker, i) {
    return function () {
        infowindow.setContent(locations[i][0]);
        infowindow.open(map, marker);
    }
})(marker, i));

要:

google.maps.event.addListener(marker, 'click', (function (marker, loc) {
    return function () {
        infowindow.setContent(loc[0]);
        infowindow.open(map, marker);
    }
})(marker, loc));

为了得到:

  

“佛瑞德”