原文 如何将经纬度利用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经度了.

范例画面:

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

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

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

上面就一个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

 

如何将经纬度利用Google Map API显示C# VS2005 Sample Code的更多相关文章

  1. Google Map API抓取地图坐标信息小程序

    因为实验室需要全国城市乡镇的地理坐标,有Execl的地名信息,需要一一查找地方的经纬度.Google Map地图实验室提供自带的查找经纬度的方法,不过需要一个点一个点的手输入,过于繁琐,所以自己利用G ...

  2. Google Map API V3开发(1)

    Google Map API V3开发(1) Google Map API V3开发(2) Google Map API V3开发(3) Google Map API V3开发(4) Google M ...

  3. Google Map API 使用总结

    Google Map API (一):显示一个最基本的地图 1 实现一个地图:<head>中引用: <script type="text/javascript" ...

  4. Android中Google地图路径导航,使用mapfragment地图上画出线路(google map api v2)详解

    在这篇里我们只聊怎么在android中google map api v2地图上画出路径导航,用mapfragment而不是mapview,至于怎么去申请key,manifest.xml中加入的权限,系 ...

  5. Google Map API v2 步步为营(一) ----- 初见地图

    官方文档:https://developers.google.com/maps/documentation/android/start?hl=zh-CN 先谷歌后百度.使用google的api基本上按 ...

  6. Google Map API 应用实例说明

    目录 Google Map API 1基础知识 1.1 Google 地图 API 概念 1.2 Google 地图的"Hello, World" 1.2.1 加载 Google ...

  7. Android Google Map API使用的八个步骤

    本系列教程将分为两部分,第一部分是指导用户使用Mapview控件进行编程,其中包括了如何获得Google Map API,如何使用该API进行简单的开发,如何获得用户当前所在的位置.第二部分则包括如何 ...

  8. Google Map API V3开发(3)

    Google Map API V3开发(1) Google Map API V3开发(2) Google Map API V3开发(3) Google Map API V3开发(4) Google M ...

  9. Google Map API V3开发(4)

    Google Map API V3开发(1) Google Map API V3开发(2) Google Map API V3开发(3) Google Map API V3开发(4) Google M ...

随机推荐

  1. [Apache Spark源代码阅读]天堂之门——SparkContext解析

    略微了解Spark源代码的人应该都知道SparkContext,作为整个Project的程序入口,其重要性不言而喻,很多大牛也在源代码分析的文章中对其做了非常多相关的深入分析和解读.这里,结合自己前段 ...

  2. 【TCP/IP 合约】 TCP/IP 基金会

    总结 : 通过学习 TCP/IP 基础, 并总结相关笔记 和 绘制思维导图 到博客上, 对 TCP/IP 框架有了大致了解, 之后開始详细学习数据链路层的各种细节协议, 并作出笔记; 博客地址 : h ...

  3. Android 获取屏幕大小和密度

    Android 获取屏幕大小和密度 DisplayMetrics metric = new DisplayMetrics(); getWindowManager().getDefaultDisplay ...

  4. Net并行编程高级教程--Parallel

    Net并行编程高级教程--Parallel 一直觉得自己对并发了解不够深入,特别是看了<代码整洁之道>觉得自己有必要好好学学并发编程,因为性能也是衡量代码整洁的一大标准.而且在<失控 ...

  5. Team Foundation Server 2015使用教程--默认团队成员添加

  6. eclipse 在win7 64两个图标出现位操作系统无法锁定到任务栏或任务栏

    eclipse 在win7 64位操作系统无法锁定到任务栏或者任务栏上出现两个图标 解决的方法 eclipse在win7 64bit下无法锁定到任务栏问题(或是锁定后任务栏出现两个eclipse图标) ...

  7. [SignalR]Self-Host

    原文:[SignalR]Self-Host SignalR 的Self-Host,可以将客户端脚本需要调用的服务端后台代码寄宿在诸如控制台应用程序中,作为寄宿端需要.NET 4.5以及jquery.s ...

  8. WebGL 支持测试,并已支持的浏览器版本摘要

    WebGL 支持情况检測与已支持浏览器版本号汇总 太阳火神的漂亮人生 (http://blog.csdn.net/opengl_es) 本文遵循"署名-非商业用途-保持一致"创作公 ...

  9. Forbidden You don't have permission to access / on this server.

    原文:Forbidden You don't have permission to access / on this server. Forbidden You don't have permissi ...

  10. wamp You don't have permission to access / on this server等问题的解决.

    原文:wamp You don't have permission to access / on this server等问题的解决. 安装完wamp之后,安装网上的教程设置虚拟路径,出现了问题,同样 ...