asp.net - 我想将 Gmap 控件中的纬度和经度获取到文本框中

标签 asp.net javascript google-maps

我尝试了以下方法,但不起作用

var txtlat=document.getElementById('TextBox1').value=GMap1.getCenter().lat();
var txtlong=document.getElementById('TextBox2').value=GMap1.getCenter().lng();

它给出 JavaScript 错误“对象不支持此属性或方法”。

我该如何做到这一点???

我真的需要帮助...

谢谢!

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication5._Default" %>

<%@ Register assembly="GMaps" namespace="Subgurim.Controles" tagprefix="cc1" %>

<!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 runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>

        <cc1:GMap ID="GMap1" runat="server" 
            Key="ABQIAAAAs98ZVKM_IHFkRP_EavW_DhT2yXp_ZAY8_ufC3CFXhHIE1NvwkxQGoS16N7wYnBPhgtjTxMaUVN58kA" />
        <br />
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
        <br />
        <br />
        <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>

    </div>
    <script type="text/javascript">

    var txtlat=document.getElementById('TextBox1').value=GMap1.getCenter().lat();
    var txtlong=document.getElementById('TextBox2').value=GMap1.getCenter().lng();

    </script>
    </form>
</body>
</html>

最佳答案

第二次更新:除了更新的问题之外,您还遇到了服务器端文本框控件的另一个问题。无法使用 document.getElementById() 从 JavaScript 引用它们就像你正在做的那样。

您可以使用普通的 HTML 控件:<input type="text" id="textbox1" />否则你将不得不使用类似 document.getElementById('<%= TextBox1.ClientID %>') 的东西从 JavaScript 引用文本框。


第一次更新:除了评论之外,下面的示例已更新为返回鼠标单击位置的纬度/经度。


您可能想查看以下示例,这些示例已经过测试可以正常工作:

使用v3 API :

<!DOCTYPE html>
<html> 
<head> 
  <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 
  <title>Google Maps getCenter()</title> 
  <script src="http://maps.google.com/maps/api/js?sensor=false" 
          type="text/javascript"></script>
</head> 
<body>
  <div id="map" style="width: 500px; height: 400px;"></div>
  <input type="text" id="textbox1" />
  <input type="text" id="textbox2" />

  <script type="text/javascript">
    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 2,
      center: new google.maps.LatLng(35.55, -25.75),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    google.maps.event.addListener(map, 'click', function(event) {
      if (event.latLng) {
        document.getElementById('textbox1').value = event.latLng.lat();
        document.getElementById('textbox2').value = event.latLng.lng();
      }
    });

  </script>
</body>
</html>

使用v2 API :

<!DOCTYPE html>
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Google Maps getCenter()</title> 
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false"
            type="text/javascript"></script> 
  </head> 
  <body onunload="GUnload()"> 
    <div id="map" style="width: 500px; height: 400px;"></div> 
    <input type="text" id="textbox1" />
    <input type="text" id="textbox2" />

    <script type="text/javascript"> 
      var map = new GMap2(document.getElementById("map"));
      var centerPoint = new GLatLng(35.55, -25.75);
      map.setCenter(centerPoint, 2);

      GEvent.addListener(map,"click", function(overlay, latlng) {     
        if (latlng) { 
          document.getElementById('textbox1').value = latlng.lat();
          document.getElementById('textbox2').value = latlng.lng();
        }
      });
    </script> 
  </body> 
</html>

上述示例的屏幕截图:

Google Maps getCenter()

关于asp.net - 我想将 Gmap 控件中的纬度和经度获取到文本框中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3047776/

相关文章:

asp.net - 使用 SEO 友好的 url 访问分页数据

javascript - 无法在选择列表上触发更改事件

javascript - 将值从一个数组移动到另一个数组并删除它们

Android MapFragment 调整大小动画断断续续/滞后

java - Android - 通过ScrollView的一部分传递触摸事件

c# - 如何从给定日期获取一年中的总天数

java - 试图在 asp.net 和 jsp 之间做出决定

jquery - 如何将 JQuery 图像 slider 与母版页一起使用?

javascript - 增加引导复选框的大小

javascript - 删除 json 标记标签