原文 如何将经纬度利用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. web前端知识体系小结(转)

    1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...

  2. android tips—NumberPicker,DataPicker,TimePicker样式改动

    在使用NumberPicker.DataPicker,TimePicker这几个控件时,非常easy出现例如以下这个界面 可是我们想要的却是以下图示的结果 改动Application.activity ...

  3. 亚马逊记AWS(Amazon Web Services)自由EC2应用

    很长时间,我听到AWS能够应用,但是需要结合信用卡,最近申请了. 说是免费的,我还是扣6.28,后来我上网查了.认为是通过进行验证.像服务期满将返回. 关键是不要让我进入全抵扣信用卡支付passwor ...

  4. 提高duilib的richedit控制的一些特征

    转载请注明原始出处.谢谢~~:http://blog.csdn.net/zhuhongshu/article/details/41208207 假设要使用透明异形窗口功能,首先要改进duilib库让他 ...

  5. 于Unity3D调用安卓AlertDialog

    例如,下面的示例代码演示 package com.sample.sampletest; import android.app.AlertDialog; import android.content.D ...

  6. Windows Phone获取WiFi BSSID

    原文:Windows Phone获取WiFi BSSID BSSID,一种特殊的Ad-hoc LAN的应用,也称为Basic Service Set (BSS),一群计算机设定相同的BSS名称,即可自 ...

  7. php形式的内容被处理

    /** * 过滤HTML内容RETURN * * @param $string * @param bool $html * * @return array|string */ public stati ...

  8. Windows平台Oracle使用USE_SHARED_SOCKET角色

    前两天在一个朋友QQ集团提出了一个问题.背景例如,下面的: 继续问后,有例如以下回复: 1.对方server连接无问题. 2.从client能够telnetserver的1521port. 3.tns ...

  9. SQL Server表分区详解

    原文:SQL Server表分区详解 什么是表分区 一般情况下,我们建立数据库表时,表数据都存放在一个文件里. 但是如果是分区表的话,表数据就会按照你指定的规则分放到不同的文件里,把一个大的数据文件拆 ...

  10. Node.js 开发指南笔记

    第一章:node简介 介绍了node是什么:node.js是一个让javascript运行在服务器端的开发平台, node能做些什么:[书上的] 具有复杂逻辑的网站 基于社交网络的大规模Web应用 W ...