asp.net - Google map 上的多个标记

标签 asp.net javascript vb.net api google-maps

我添加了一个带有两个标记的谷歌地图(我只是测试),代码是:

function load() {

    var map = new GMap2(document.getElementById("map"));


    var marker = new GMarker(new GLatLng(<%=coordinates%>));
    var marker2 = new GMarker(new GLatLng(31.977211,35.951729));
    var html="<%=maptitle%><br/>" +
         "<%=text%>";
    var html2="<img src='simplemap_logo.jpg' width='20' height='20'/> " +
         "<%=maptitle%><br/>" +
         "<%=text%>" + "Alper";
    map.setCenter(new GLatLng(<%=coordinates%>), 5);
    map.setMapType(G_HYBRID_MAP);
    map.addOverlay(marker);
    map.addOverlay(marker2);
    map.addControl(new GLargeMapControl());
    map.addControl(new GScaleControl());
    map.addControl(new GMapTypeControl());


    marker.openInfoWindowHtml(html);
    marker2.openInfoWindowHtml(html2);
    }

问题是,只有一个标记文本显示(内部有文本的白色三 Angular 形),另一个不可见,为什么? 另一件事,我有一个 map 表,如下所示:mapID、mapCoordinates、mapMarkerTitle、mapMarkerText,我可以检索该表,但我想要一种方法能够将其所有记录传递给我的javascript并为每个 map 创建一个标记我的 table 上有,我知道这是两个,但是有人可以建议或帮助我编写代码吗?因为我对 javascript 一无所知:D

HTML 输出是:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
    Untitled Page
</title>
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAANgu3GlobW5KtQorgXrnJ_xTHM4EYhrvsce8mdg4KdiCoPfCQKxSOZ_5sjy4O31twg6cxfZqam24TCw"
      type="text/javascript"></script>

    <script type="text/javascript">

     function load() {

    var map = new GMap2(document.getElementById("map"));


    var marker = new GMarker(new GLatLng(32.523251,35.816068));
    var marker2 = new GMarker(new GLatLng(31.977211,35.951729));
    var html="maen<br/>" +
         " maen tamemi";
    var html2="<img src='simplemap_logo.jpg' width='20' height='20'/> " +
         "maen<br/>" +
         " maen tamemi" + "Alper";
    map.setCenter(new GLatLng(32.523251,35.816068), 5);
    map.setMapType(G_HYBRID_MAP);
    map.addOverlay(marker);
    map.addOverlay(marker2);
    map.addControl(new GLargeMapControl());
    map.addControl(new GScaleControl());
    map.addControl(new GMapTypeControl());



    marker2.openInfoWindowHtml(html2);
    marker.openInfoWindowHtml(html);
    }

    //]]>
    </script>

    <script type="text/javascript">

      function pageLoad() {
      }

    </script>

</head>
<body onload = "load()">
    <form name="form1" method="post" action="Xhome.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJNDI5NDcxNTY4ZGTjxbb38769ZB2N9Ow9kAzPz2PIqA==" />
</div>

    <div id="map" style="width:400px;height:300px" >

    </div>
    </form>
</body>
</html>

最佳答案

回答您问题的第二部分:

i want a way to be able to pass all its records to my javascript and create a Marker for each Map i have in my table

我(作为示例 - 大约一年前编写)以下代码:

在代码隐藏中我有这样的东西(恐怕是c#):

[WebMethod]
public LatitudeLogitudeMessage[] GetPoints(string postCodes)
{
    string[] postCodeArray = postCodes.Split(",".ToCharArray());

    LatitudeLogitudeMessage[] pointArray = 
                   new LatitudeLogitudeMessage[postCodeArray.Length];
    int index = 0;
    foreach (string postCode in postCodeArray)
    {
        pointArray[index] = GetPoint(postCode);
        index++;
    }

    return pointArray;
}

LatitudeLogitudeMessage 是一个自定义类,如下所示:

public class LatitudeLogitudeMessage
{
    public decimal? Latitude { get; set; }
    public decimal? Longitude { get; set; }
    public string Message { get; set; }
    public string Details { get; set; }
    public string Address { get; set; }

    public LatitudeLogitudeMessage(string addressToFind)
    {
        Address = addressToFind;
        Details = addressToFind.Replace(",", ",<br />");
    }
}

GetPoint 方法基本上填写了这些详细信息。

在前面的代码中我有:

PageMethods.GetPoints(address, showPoints);

在后面的代码中调用 GetPoints 方法,并将结果传递给 showPoints:

function showPoints(latLongs)
{
  GLog.write("Showing points");
  var points = [];
  var latLngBounds = new GLatLngBounds();

  for (var i = 0; i < latLongs.length; i++)
  {
    if ("" == latLongs[i].Message)
    {
      points[i] = new GLatLng(latLongs[i].Latitude, latLongs[i].Longitude);
      var marker = 
            new GMarker(points[i], {title: latLongs[i].Details, clickable: false});
      map.addOverlay(marker);
      latLngBounds.extend(points[i]);
    }
    else
    {
      GLog.write(latLongs[i].Message);
    }
  }

  if (points.length > 1)
  {
    var bounds = new GBounds(points);
    var center = new GLatLng(
         (latLngBounds.getSouthWest().lat() 
           + latLngBounds.getNorthEast().lat()) /2.,
         (latLngBounds.getSouthWest().lng() 
           + latLngBounds.getNorthEast().lng()) /2.);
    var newZoom = map.getBoundsZoomLevel(latLngBounds, map.getSize());
    map.setCenter(center, newZoom);
  }
  else
  {
    map.setCenter(points[0], defaultZoomLevel);
  }
}

因此,这需要点数组,并迭代它们,创建一个标记,以列表中的第一项为中心(不聪明,但它对我有用)。

关于asp.net - Google map 上的多个标记,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/606515/

相关文章:

asp.net - 禁用asp.net缓存

c# - 将 GridView 中 HiddenField 的值设置为新的 GUID

asp.net - 模拟的 UserManager 和 roleManager 方法返回 null

javascript - 使用 CSS 将页面调整为 450px 时如何更改每行中的图片数量?

vb.net - 如何使用 openxml 2.0 创建日期单元格

c# - 如何防止 Jquery 可排序连接列表中的重复条目?

javascript - 如何在 jQuery click() 函数中访问调用元素的 id

javascript - 如何在没有 Web 服务器的情况下将变量数据从 Python 传输到 Javascript?

c# - 如何使用后期绑定(bind)从 VB.Net 调用位于 C# DLL 中的方法

mysql - vb.net datagridview过滤列未运行