Google Map API抓取地图坐标信息小程序
因为实验室需要全国城市乡镇的地理坐标，有Execl的地名信息，需要一一查找地方的经纬度。Google Map地图实验室提供自带的查找经纬度的方法，不过需要一个点一个点的手输入，过于繁琐，所以自己利用Google Map API编写了一个很小的程序，根据需要有多个版本，挺方便的。
不过还要提一下，利用Baidu Map API 的localsearch很方便查找位于一个城市的街道、城镇或其他信息，比如我要搜索北京市的所有肯德基的地理坐标，如下代码就可以满足：
<title>批量获取模糊搜索地址名称及坐标</title> <meta name="Keywords" content="批量,获取坐标,模糊搜索">
<meta name="Description" content="本网页提供了批量搜索地名并返回地址及坐标的功能！"> <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script> </head> <body>
<P>搜索城市<input id="txtCity" type="text" value="北京市" /></n>
<p>地名关键词<input id="txtSearch" type="text" value="肯德基" />
<input type="button" value="生成坐标序列" onclick="search()" /> </n>
<p>显示结果<textarea id="txtResult" rows="10" cols="30" value="" /></textarea> <div id="divMap" style="width:400px;height:400px;border:solid 1px gray"></div> <script type="text/javascript">
function $(id){
return document.getElementById(id);//定义$,以便调用
}
var map = new BMap.Map("divMap");//创建地图
var city=new BMap.LocalSearch(map,{renderOptions:{map:map,autoViewport:true}}); function search(){
$("txtResult").value=""//每次生成前清空文本域
map.clearOverlays(); //清除地图上所有标记
var c=$("txtCity").value;
city.search(c);//查找城市
var s=$("txtSearch").value;
var ls = new BMap.LocalSearch(c);
ls.search(s);
var i=1; ls.setSearchCompleteCallback(function(rs){
if (ls.getStatus() == BMAP_STATUS_SUCCESS){
for(j=0;j<rs.getCurrentNumPois();j++)
{
var poi=rs.getPoi(j);
map.addOverlay(new BMap.Marker(poi.point)); //如果查询到，则添加红色marker $("txtResult").value+= poi.title+":" +poi.point.lng+","+poi.point.lat+'\n'; }
if(rs.getPageIndex!=rs.getNumPages())
{
ls.gotoPage(i);
i=i+1;
}
}});}
</script>
</body>
</html>
不过由于百度地图坐标是经过加密的，没有办法和已知的WGS坐标联系起来，所以选择了放弃。而翻看了许多资料才发现，对应的Google Map API 则没有了localsearch这个函数（在10年左右封掉了），只能利用getLatLng()函数一个一个的查询
参考了网上的一个抓一个点的代码，该代码可以完成一个点一个点的查询经纬度的功能：
<!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>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>地理位置坐标转换</title> <script src="http://ditu.google.cn/maps?file=api&v=2&key=ABQIAAAAe3YR_oZq7RQougOHlEQYxRTrT8HRiYVHGz6s-cexYhuHznMTnBQJ3hrfCSvSmQ_Fqr80B62kDy8djA&sensor=true"
type="text/javascript"></script> <script type="text/javascript">
window.g = {};
window.$ = function (id) { return document.getElementById(id) };
window.onload = function () {
if (GBrowserIsCompatible()) {
g.map = new GMap2($("map"));
//加载google地图控件
g.map.addControl(new GLargeMapControl());
g.map.addControl(new GMapTypeControl());
g.map.addControl(new GScaleControl());
//实例化google客户端地理编码类(GClientGeocoder)
g.geocoder = new GClientGeocoder(); g.getCoordinates = function (address) {
g.geocoder.getLatLng(
address,
function (point) {
if (point) {
alert(point.lat());
alert(point.lng()); g.map.setCenter(point, 13);
var marker = new GMarker(point);
g.map.addOverlay(marker);
var info = "<strong>" + address + "</strong><br />坐标: " + point.lat() + "," + point.lng();
$("info").innerHTML = info;
marker.openInfoWindowHtml(info);
marker.__address_info = info;
GEvent.addListener(marker, "click", function () {
g.map.setCenter(this.getLatLng());
this.openInfoWindowHtml(this.__address_info);
$("info").innerHTML = info;
});
}
else {
alert("无法解析: " + address);
}
}
)
} $("btn_go").onclick = function () {
g.getCoordinates($("address").value);
}
$("btn_go").onclick();
}
else {
alert('不支持的浏览器');
}
}
window.onunload = function () {
GUnload();
}
</script>
<style media="screen">
body
{
margin: 0;
padding: 0;
font-size: 9pt;
line-height: 1.5em;
}
#frame
{
width: 700px;
margin: 20px auto 10px;
}
#form
{
margin: 0 0 10px;
text-align: center;
}
#form input
{
border: 1px solid #ccc;
font-size: 9pt;
width: 200px;
}
#form button
{
font-size: 9pt;
border: 1px solid #ccc;
}
#form button:hover
{
background: #eef;
}
#map
{
height: 400px;
margin: 0 0 10px;
border: 5px solid #ccc;
}
#vifix
{
text-align: center;
}
#vifix a
{
color: #f00;
text-decoration: none;
}
#vifix a:hover
{
color: #f96;
}
</style>
</head>
<body>
<div id="frame">
<div id="form">
输入一个地址:
<input id="address" value="杭州市西湖三潭印月" />
<button id="btn_go">
获取坐标</button>
</div>
<div id="map">
</div>
<div id="info">
</div>
<div id="vifix">
Powered by <a href="http://code.google.com/apis/maps/" target="_blank">Google Map API</a>
/ Created by <a href="http://vifix.cn%22%3evifix.cn%3c/a>
</div>
</div>
</body>
</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>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>地理位置坐标转换</title>
<style media="screen">
body
{
margin: 0;
padding: 0;
font-size: 9pt;
line-height: 1.5em;
}
#frame
{
width: 1200px;
margin: 20px auto 10px;
}
#searchMap
{
margin: 0 0 10px;
text-align: center;
} # button
{
font-size: 9pt;
border: 1px solid #ccc;
} #txtRight,#txtLeft{
float: left;
}
#result{
margin-left: 200px;
height: 200px;
}
#searchMap button:hover
{
background: #eef;
}
#vifix
{
text-align: center;
}
#vifix a
{
color: #f00;
text-decoration: none;
}
#vifix a:hover
{
color: #f96;
}
</style>
<script src="http://ditu.google.cn/maps?file=api&v=2&key=ABQIAAAAe3YR_oZq7RQougOHlEQYxRTrT8HRiYVHGz6s-cexYhuHznMTnBQJ3hrfCSvSmQ_Fqr80B62kDy8djA&sensor=true"
type="text/javascript"></script>
<script type="text/javascript"> window.g = {};
window.$ = function (id) { return document.getElementById(id) };
window.onload = function () {
if (GBrowserIsCompatible()) {
g.map = new GMap2($("map"));
//加载google地图控件
g.map.addControl(new GLargeMapControl());
g.map.addControl(new GMapTypeControl());
g.map.addControl(new GScaleControl());
//实例化google客户端地理编码类(GClientGeocoder)
g.geocoder = new GClientGeocoder(); g.getCoordinates = function (address) {
g.geocoder.getLatLng(
address,
function (point) {
if (point) { var infoReasult =address+" "+point.lat() +" "+ point.lng()+'\n'; $("txtResult").value+=infoReasult // var infoArea=address+'\n'; //$("txtArea").value+=infoArea; }
else { var unfound="没有查询到的点有：<br />";
$("unfound").innerHTML=unfound;
$("unfound").innerHTML+=address+"<br />";
}
}
)
} $("btn_go").onclick = function () {
$("info").innerHTML="";
$("txtResult").value="";
// $("txtArea").value=""; var strSearch=$("txtSearch").value;
var addresses=strSearch.split('\n');
console.log(addresses); var strProvince=addresses[0].split('(')[0];
var strCity=addresses[1].split('(')[0];
var strTown=addresses[2].split('(')[0];
var strPrefix=strProvince+strCity+strTown; for(var i=3;i<addresses.length&&addresses[i]!="";i++){ // console.log(strPrefix+addresses[i]);
g.getCoordinates(strPrefix+addresses[i]); } }
$("btn_go").onclick();
}
else {
alert('不支持的浏览器');
}
}
window.onunload = function () {
GUnload();
}
</script> </head>
<body>
<div id="frame"> <div id="searchMap"> <p>输入查询的点（用回车分开）</p><button id="btn_go">获取坐标</button><br/>
<textarea id="txtSearch" rows="20" cols="40"/>第一行为省份：江苏省(349街道，836镇，
第二行为城市：南京市(81街道，19镇)
第三行为市区：玄武区(7街道)
第四行以下为街道
如：
江苏省(349街道，836镇，
南京市(81街道，19镇)
玄武区(7街道)
锁金村街道
红山街道 </textarea> <div id="info">
</div>
<div id="result">
<p>查询结果:</p> <div id="txtRight"><textarea id="txtResult" rows="10" cols="70" value="" /></textarea></div>
<div id="unfound">
</div>
</div>
</div> <div id="map">
</div>
<div id="vifix">
Powered by <a href="http://code.google.com/apis/maps/" target="_blank">Google Map API</a>
/ Created by <a href="http://vifix.cn%22%3evifix.cn%3c/a>
</div>
</div>
</body>
</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>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>地理位置坐标转换</title>
<style media="screen">
body
{
margin: 0;
padding: 0;
font-size: 9pt;
line-height: 1.5em;
}
#frame
{
width: 1200px;
margin: 20px auto 10px;
}
#searchMap
{
margin: 0 0 10px;
text-align: center;
} # button
{
font-size: 9pt;
border: 1px solid #ccc;
} #txtArea{ }
#txtRight,#txtLeft{
float: left;
}
#result{
margin-left: 200px;
height: 200px;
}
#searchMap button:hover
{
background: #eef;
}
#vifix
{
text-align: center;
}
#vifix a
{
color: #f00;
text-decoration: none;
}
#vifix a:hover
{
color: #f96;
}
</style>
<script src="http://ditu.google.cn/maps?file=api&v=2&key=ABQIAAAAe3YR_oZq7RQougOHlEQYxRTrT8HRiYVHGz6s-cexYhuHznMTnBQJ3hrfCSvSmQ_Fqr80B62kDy8djA&sensor=true"
type="text/javascript"></script>
<script type="text/javascript"> window.g = {};
window.$ = function (id) { return document.getElementById(id) };
window.onload = function () {
if (GBrowserIsCompatible()) {
g.map = new GMap2($("map"));
//加载google地图控件
g.map.addControl(new GLargeMapControl());
g.map.addControl(new GMapTypeControl());
g.map.addControl(new GScaleControl());
//实例化google客户端地理编码类(GClientGeocoder)
g.geocoder = new GClientGeocoder(); g.getCoordinates = function (address) {
g.geocoder.getLatLng(
address,
function (point) {
if (point) { var infoReasult =point.lat() +" "+ point.lng()+'\n'; $("txtResult").value+=infoReasult var infoArea=address+"\n"; $("txtArea").value+=infoArea; }
else { var unfound="没有查询到的点有：<br />";
$("unfound").innerHTML=unfound;
$("unfound").innerHTML+=address+"<br />";
}
}
)
} $("btn_go").onclick = function () {
$("info").innerHTML="";
$("txtResult").value="";
$("txtArea").value=""; var strSearch=$("txtSearch").value;
var addresses=strSearch.split('\n');
console.log(addresses); var strProvince=addresses[0].split('(')[0];
var strCity = new Array();
var strTown= new Array();
var strPrefix = new Array();
var k=0; for(var j=1;j<addresses.length&&addresses[j]!="";j++){
if(addresses[j].indexOf("市")>0){
strCity[k]=addresses[j].split('(')[0];
strTown[k]=addresses[j+1].split('(')[0];
strPrefix[k]=strProvince+strCity[k]+strTown[k]; for(var i=j+2;i<addresses.length&&addresses[i]!=""&&(addresses[i].indexOf("市")<0);i++){
//console.log(strPrefix[k]+addresses[i]);
g.getCoordinates(strPrefix[k]+addresses[i]); }
k=k+1;
}
}
} function adressSplit(adresses){
if(adresses.indexOf("市")>0){
if(adresses.indexOf("区")>0){
return adresses.split("区")[1];
}
else if(adresses.indexOf("县")>0){
return adresses.split("县")[1];
}
else if(adresses.indexOf("旗")>0){
return adresses.split("旗")[1];
}
else{
return adresses.split("市")[1];
}
}
else{
if(adresses.indexOf("区")>0){
return adresses.split("区")[1];
}
}
}
$("btn_split").onclick=function(){ var strSearch=$("txtArea").value;
console.log(sstrSearch);
$("txtSplit").value=""; var sstrSearch=strSearch.split("\n"); for(var i=0;i<sstrSearch.length;i++){
var infoArea=adressSplit(sstrSearch[i])+"\n";
console.log(infoArea);
//console.log(adressSplit(sstrSearch[i]));
$("txtSplit").value+=infoArea;
}
}
// $("btn_go").onclick();
}
else {
alert('不支持的浏览器');
}
}
window.onunload = function () {
GUnload();
}
</script> </head>
<body>
<div id="frame"> <div id="searchMap"> <p>输入查询的点（用回车分开）</p><button id="btn_go">获取坐标</button><br/>
<textarea id="txtSearch" rows="20" cols="40"/>第一行为省份：江苏省(349街道，836镇，
第二行为城市：南京市(81街道，19镇)
第三行为市区：玄武区(7街道)
第四行以下为街道
如：
江苏省(349街道，836镇，
南京市(81街道，19镇)
玄武区(7街道)
锁金村街道
红山街道 </textarea> <div id="info">
</div>
<div id="result">
<p>查询结果:</p>
<div id="txtLeft"> <textarea id="txtArea" rows="10" cols="35" value="" /></textarea></div>
<div id="txtRight"><textarea id="txtResult" rows="10" cols="40" value="" /></textarea></div>
<button id="btn_split">分割</button><br/> <div id="txtRight"><textarea id="txtSplit" rows="10" cols="40" value="" /></textarea></div>
<div id="unfound">
</div>
</div>
</div> <div id="map">
</div>
<div id="vifix">
Powered by <a href="http://code.google.com/apis/maps/" target="_blank">Google Map API</a>
/ Created by <a href="http://vifix.cn%22%3evifix.cn%3c/a>
</div>
</div>
</body>
</html>
Google Map API抓取地图坐标信息小程序的更多相关文章
- 如何使用Google Map API开发Android地图应用
两年前开发过的GoogleMap已经大变样,最近有项目要用到GoogleMap,重新来配置Android GoogleMap开发环境,还真是踩了不少坑. 一.下载Android SDK Manager ...
- Google Map API 使用总结
Google Map API (一):显示一个最基本的地图 1 实现一个地图:<head>中引用: <script type="text/javascript" ...
- Google Map API使用详解（一）——Google Map开发背景知识
一.谷歌地图主页 谷歌地图对应不同的地区都会有一些专门的主页,首次登陆时会显示这些地区.比如,香港的:http://maps.google.com.hk,台湾的:http://maps.google. ...
- Android中Google地图路径导航，使用mapfragment地图上画出线路(google map api v2)详解
在这篇里我们只聊怎么在android中google map api v2地图上画出路径导航,用mapfragment而不是mapview,至于怎么去申请key,manifest.xml中加入的权限,系 ...
- Google Map API v2 步步为营（一） ----- 初见地图
官方文档:https://developers.google.com/maps/documentation/android/start?hl=zh-CN 先谷歌后百度.使用google的api基本上按 ...
- 谷歌地图实现车辆轨迹移动播放(google map api)
开发技术:jquery,js baidu map api,json,ajax QQ1310651206 谷歌地图(google map api)实现车辆轨迹移动播放(google map api)
- 如何将经纬度利用Google Map API显示C# VS2005 Sample Code
原文 如何将经纬度利用Google Map API显示C# VS2005 Sample Code 日前写了一篇如何用GPS抓取目前所在,并回传至资料库储存,这篇将会利用这些回报的资料,将它显示在地图上 ...
- 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 ...
- 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 ...
随机推荐
- 学习python3
定义一个函数 你可以定义一个由自己想要功能的函数,以下是简单的规则: 函数代码块以 def 关键词开头,后接函数标识符名称和圆括号 (). 任何传入参数和自变量必须放在圆括号中间,圆括号之间可以用于定 ...
- CodeForces 834D The Bakery(线段树优化DP)
Some time ago Slastyona the Sweetmaid decided to open her own bakery! She bought required ingredient ...
- Nutch2.2.1 问题一:索引不能提交
按照bin/nutch下的脚步一步一步的执行抓取:Inject,Generate,Fetcher,Parse,Updatedb,Solrindex,SolrDump. 每部其实都可以打出 “bin/n ...
- docker+selenium grid解决node执行经常卡死
执行用例时出现下图: 可以在启动node节点容器时添加如下红色字体的参数 docker run -d -p 5903:5900 --shm-size=512m --link selenium_hub: ...
- CentOS下Docker与.netcore(二) 之 Dockerfile
CentOS下Docker与.netcore(一) 之 安装 CentOS下Docker与.netcore(二) 之 Dockerfile CentOS下Docker与.netcore(三)之 三剑客 ...
- Spring Boot - Spring Async
除了使用Thread.Runnable.TimerTask.FeatureTask.CompletableFuture等类,在Spring Boot中还可以使用注解创建异步任务,可以减少线程处理的代码 ...
- springboot pom 详解
Starter POMs是可以包含到应用中的一个方便的依赖关系描述符集合.可以获取所有spring及相关技术的一站式服务,不需要翻阅示例代码,拷贝粘贴大量的依赖描述符. Starter名字的含义: 所 ...
- sublime 插件安装之sublime highlight 如何优雅拷贝代码到word
首先:打开preference => Package Control,输入 Add Repository ,用它来为Sublime 添加插件安装源, https://github.com/n ...
- [TJOI2007] 线段
因为每行必须走完才能到下一行,所以我们有两种决策: 1.最后留在线段左端点 2.最后留在线段右端点 这种存在状态转移且多决策的问题用动态规划来进行递推是最好不过的了. 所以我们设\(dp[i][0/1 ...
- kali linux之Meterpreter
高级,动态,可扩展的payload 基于meterpreter上下文利用更多漏洞发起攻击,后渗透阶段一站式操作界面 完全基于内存的dll注入式payload(不写硬盘) 注入合法系统进程并建立stag ...