如何将经纬度利用Google Map API显示C# VS2005 Sample Code

简介: 原文 如何将经纬度利用Google Map API显示C# VS2005 Sample Code 日前写了一篇如何用GPS抓取目前所在,并回传至资料库储存,这篇将会利用这些回报的资料,将它显示在地图上,这个做法有两种,最简单的就是直接传值到Google Maps上.

原文 如何将经纬度利用Google Map API显示C# VS2005 Sample Code

日前写了一篇如何用GPS抓取目前所在,并回传至资料库储存,这篇将会利用这些回报的资料,将它显示在地图上,这个做法有两种,最简单的就是直接传值到Google Maps上.

 

举例来说,当我们知道经纬度后,只要将数据套到以下网址即可.

http://maps.google.com/maps?q=25.048346%2c121.516396

在参数q=后面,就可以加上经纬度了.

25.048346是Latitude纬度

%2c是空格

121.516396就是Longitude经度了.

范例画面:

image

 

而另一种做法就比这个复杂一点,要使用Google API来做,首先,要使用google API就必需要有google的帐号,没帐号是无法申请的,当有google的帐号后,就可以到http: //code.google.com/apis/maps/signup.html开始申请了.

image

最 下方My web site URL就输入各位的URL啰,如果输入的与执行google map api的URL不同,那就无法执行了.所以这个URL务必输入正确, 输入正确的URL并将上方的CheckBox打勾后,就可以按Generate API Key了,如果已经登入GOOGLE的,就不会再跳登入画面,之后就会跳到另一个画面,上面就有Key及Example Code了,当有了这些,就可以开始自己写Code了.

 

基本上,因为主要是Demo用的,所以设计介面很简单.

map1

上面就一个DropDownList,因为先前的范例资料的关系,先手动在ITEM上加上1跟2.

而下方的地图,就跟申请API时的Example Code一样. 原始码如下:

 

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

 <!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>GPS 位置地图</title>  <script src= "http://maps.google.com/maps?file=api&amp;v=2&amp;key=输入你的Key"  type= "text/javascript" ></script>  <script src= "http://www.google.com/uds/api?file=uds.js&v=1.0&key=输入你的Key"  type= "text/javascript" ></script>  <script src= "http://www.google.com/uds/solutions/localsearch/gmlocalsearch.js" type= "text/javascript" ></script>  <style type= "text/css" > @import url( "http://www.google.com/uds/css/gsearch.css" );  @import url( "http://www.google.com/uds/solutions/localsearch/gmlocalsearch.css" );  </style>  <script type= "text/javascript" >  //<![CDATA[  function load(x,y,LocationName) {  if (GBrowserIsCompatible()) {  var map = new GMap2(document.getElementById( "map" ));  var point = new GLatLng(x,y);  map.setCenter(point, 16);  map.addOverlay( new GMarker(point));  map.addControl( new GLargeMapControl());  map.addControl( new GMapTypeControl());  map.addControl( new GScaleControl());  var lsc = new google.maps.LocalSearch();  map.addControl( new google.maps.LocalSearch() , new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,20)));  map.openInfoWindowHtml (map.getCenter(), LocationName);  }  }  //]]>  </script>  </head>  <body id= "MainBody" runat= "server" >  <form id= "form1" runat= "server" >  <div>  <asp:DropDownList ID= "ddl_Location" runat= "server" AutoPostBack= "True" OnSelectedIndexChanged= "ddl_Location_SelectedIndexChanged"  Width= "500px" >  <asp:ListItem>1</asp:ListItem>  <asp:ListItem Value= "2" >2</asp:ListItem>  </asp:DropDownList><br />  <br />  <div id= "map" style= "width: 500px; height: 400px" >  </div>  </div>  </form>  </body>  </html> 

 

 

 

只要将"输入你的Key"的地方置换为你在Google MAP API申请到的Key即可.

 

    protected void Page_Load( object sender, EventArgs e)
     {
         if (!IsPostBack)  {  if (Request.QueryString.HasKeys())  {  string longitude = Request.QueryString.Get( "lon" );  string latitude = Request.QueryString.Get( "lat" );  string LN = Request.QueryString.Get(Server.UrlDecode( "LN" ));  this .MainBody.Attributes.Add( "onload" , "load(" + longitude + "," + latitude + ",'" + LN + "')" );  }  else  {  DataTable dt = GetLocation(ddl_Location.SelectedValue);  if (dt.Rows.Count > 0)  {  DataRow dr = dt.Rows[0];  this .MainBody.Attributes.Add( "onload" , "load(" + dr[ "Latitude" ].ToString() + "," + dr[ "Longitude" ].ToString() + ",'" + dr[ "updtime" ].ToString() + "')" );  }  }  }  }  protected void ddl_Location_SelectedIndexChanged( object sender, EventArgs e)  {  try  {  DataTable dt = GetLocation(ddl_Location.SelectedValue);  if (dt.Rows.Count > 0)  {  DataRow dr = dt.Rows[0];  this .MainBody.Attributes.Add( "onload" , "load(" + dr[ "Latitude" ].ToString() + "," + dr[ "Longitude" ].ToString() + ",'" + dr[ "updtime" ].ToString() + "')" );  }  }  catch (Exception ex)  {  Response.Write(ex.Message);  }  }  private DataTable GetLocation( string UID)  {  try  {  string strconn = "Data Source=localhost;Initial Catalog=GPSDB;User Id=GPSUser;Password=gpsuser;" ;  SqlConnection conn = new SqlConnection(strconn);  string strcmd = "select Latitude,Longitude,UpdTime from GPSDB..gpstrace where UID=@UID" ;  SqlCommand cmd = new SqlCommand(strcmd, conn);  cmd.Parameters.AddWithValue( "@UID" , UID);  SqlDataAdapter da = new SqlDataAdapter(cmd);  DataTable dt= new DataTable();  da.Fill(dt);  return dt;  }  catch (Exception ex)  {  throw new Exception(ex.Message);  }  } 

 

 

 

如此一来,就大功告成了,但或许有些人会有些遗问,那么MAP上,可以自订一些东西,例如不给搜寻列,这都是可以做到的,可以参考Google Map API Examples ,这里就有很多详细的说明.

 

感觉起来,GPS定位的想法部份,好像到此就没了,但在这过程中也发现到,其实Google Map有出Mobile版 的,而它的定位可不只是局限在GPS卫星讯号,而是可以用手机的讯号去定位,也就是说,他是透过手机与基地台之间的传输来计算出所在位置,这样就可以不受 到手机没有GPS功能模组或收不到卫星讯号所限制,这个概念其实也不算新,记得几年前的Run!PC杂志上就有篇文章是在介绍这个的,采用的技术是 Java.

 

不过不管如何,可以预见的是,这个的应用会愈来愈多元,谁说未来还要自己去用电脑下载图资再更新到自己的GPS装置上,装置上的地图永远会是最新的,加上Street View,也不用去看那电脑画出来的3D的道路图了,或许3G或无线上网的普及,这些运用将会更广泛.

 

参考资料:

Google Map API Examples

Google Map Mobile

 

原始码: GPSMap.zip

 
目录
相关文章
|
25天前
|
人工智能 Java API
Google Gemini API 接口调用方法
Google 最近发布的 Gemini 1.0 AI 模型通过其升级版,Gemini,标志着公司迄今为止最为强大和多功能的人工智能技术的突破。
|
2月前
Google Earth Engine(GEE)——从列表中少选所需要的数字不用map函数,还能如何实现?简单方法介绍
Google Earth Engine(GEE)——从列表中少选所需要的数字不用map函数,还能如何实现?简单方法介绍
17 0
|
9月前
|
数据可视化 搜索推荐 JavaScript
数据可视化大屏百度地图区域掩膜MapMask实现地图指定区域非省市县行政区显示的实战案例解析(JavaScript API GL、个性化地图定制、指定区域经纬度拾取转化)
数据可视化大屏百度地图区域掩膜MapMask实现地图指定区域非省市县行政区显示的实战案例解析(JavaScript API GL、个性化地图定制、指定区域经纬度拾取转化)
674 0
|
2月前
Google Earth Engine(GEE)——如何建立一个逐日的时序图表chart用map进行遍历
Google Earth Engine(GEE)——如何建立一个逐日的时序图表chart用map进行遍历
17 0
|
2月前
|
JSON 搜索推荐 API
【2024更新】如何使用google index api来自动提交url
本文提供了一个详细的指南,说明如何创建并使用使用google index api,google自动提交url来优化seo。
34 0
|
4月前
|
API Python Windows
[已解决] openai.error.AuthenticationError: No API key provided. You can set your API key in code using
[已解决] openai.error.AuthenticationError: No API key provided. You can set your API key in code using
106 0
|
9月前
|
移动开发 JavaScript 定位技术
百度地图开发:地图调起API(Web端)使用终点经纬度直接调用百度地图导航信息的解决方案
百度地图开发:地图调起API(Web端)使用终点经纬度直接调用百度地图导航信息的解决方案
216 0
|
6月前
|
关系型数据库 MySQL API
Go语言微服务框架 - 6.用Google风格的API接口打通MySQL操作
随着RPC与MySQL的打通,整个框架已经开始打通了数据的出入口。 接下来,我们就尝试着实现通过RPC请求操作MySQL数据库,打通整个链路,真正地让这个平台实现可用。
18 0
|
6月前
|
数据处理 开发者 Python
Google Earth Engine Map教程书中英双语
Google Earth Engine Map教程书中英双语
123 0
|
8月前
|
云安全 API
阿里云安全的API返回code为200
阿里云安全的API返回code为200
839 1