文档章节

百度地图经纬度,转换为地图上的点

邂逅江南为伊留恋
 邂逅江南为伊留恋
发布于 2017/05/03 10:17
字数 460
阅读 35
收藏 0
点赞 0
评论 0
<!doctype html>  
<html lang="en">  
<head>  
    <title>根据地址查询经纬度</title>  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>  
    <script type="text/javascript" src="../js/jquery-1.12.1.min.js"></script>  
    <style>  
        a.{  
        margin-right:100px;  
        }  
    </style>  
</head>  
<body style="background:#CBE1FF">  
<div style="width:730px;margin:auto;">  
    <input class="a" type="hidden" value="金水区"/>  
    <input class="a" type="hidden" value="二七区"/>  
    <input class="a" type="hidden" value="管城区"/>  
    <input class="a" type="hidden" value="经开区"/>  
    <input class="a" type="hidden" value="金水区"/>  
    <input class="a" type="hidden" value="高新区"/>  
    <input class="a" type="hidden" value="惠济区"/>  
    <input class="a" type="hidden" value="郑东新区"/>  
    <div id="container"  
         style="position: absolute;  
                margin-top:30px;  
                width: 730px;  
                height: 590px;  
                top: 50px;  
                border: 1px solid gray;  
                overflow:hidden;">  
    </div>  
</div>  
</body>  
<script type="text/javascript">  
  
    var map = new BMap.Map("container");  
    var point = new BMap.Point(113.48722, 23.187232);  
    map.centerAndZoom(point, 13);  
    var localSearch = new BMap.LocalSearch(map);  
    localSearch.enableAutoViewport(); //允许自动调节窗体大小  
  
    map.enableScrollWheelZoom();    //启用滚轮放大缩小,默认禁用  
    map.enableContinuousZoom();    //启用地图惯性拖拽,默认禁用  
  
    map.addControl(new BMap.NavigationControl());  //添加默认缩放平移控件  
    map.addControl(new BMap.OverviewMapControl()); //添加默认缩略地图控件  
    map.addControl(new BMap.OverviewMapControl({isOpen: true, anchor: BMAP_ANCHOR_BOTTOM_RIGHT}));   //右下角,打开  
    var pointArray = [];//创建数组接收转化后的多个坐标值  
    var keyword = [];//从页面获取到的需要转化的地址  
    var keywordVal;  
    $(".a").each(function (i) {//从页面获取多个地址并且存放在shuzuzhong  
        keywordVal = $(".a").eq(i).val();  
        keyword.push(keywordVal);  
        searchByStationName();  
    });  
* console.info(keyword); */  
var markerArray = [];  
function searchByStationName(keywordVal) {  
map.clearOverlays();// 清空原来的标注  
localSearch.search(keywordVal);  
localSearch.setSearchCompleteCallback(function(searchResult) {  
var poi = searchResult.getPoi(0);  
map.centerAndZoom("郑州", 13);  
var longitude = poi.point.lng;// 经度  
var latitude = poi.point.lat;// 纬度  
var pointVal = new BMap.Point(longitude, latitude);  
pointArray.push(pointVal);  
var marker = new BMap.Marker(pointVal);  
markerArray.push(marker);  
// 创建标注,为要查询的地方对应的经纬度  
map.addOverlay(marker);  
//在页面上展示出当前位置信息  
var infoWindow = new BMap.InfoWindow("<p style='font-size:14px;'>"+ searchResult.keyword + "</p>");  
marker.addEventListener("click", function() {  
this.openInfoWindow(infoWindow);  
});  
marker.setAnimation(BMAP_ANIMATION_BOUNCE); // 跳动的动画  
  });  
}  
console.info(pointArray);</script></html>

百度地图经纬度转换为地图上的点

© 著作权归作者所有

共有 人打赏支持
邂逅江南为伊留恋
粉丝 0
博文 6
码字总数 1721
作品 0
郑州
程序员
浅谈百度Baidu坐标系反转至WGS84的三种思路

摘要:基于百度地图进行数据展示是目前项目中常见场景,但是因为百度地图是基于BD09坐标系的,GPS坐标(WGS84)或者其他常见的标准坐标是无法准确在地图上进行展示的,但是互联网在线情况下,...

sinat_34719507 ⋅ 2017/03/09 ⋅ 0

瓦片地图原理

引言 谷歌地图、百度地图、高德地图、腾讯地图、Bing地图这些互联网地图是怎么制作的? 经纬度 地球是一个椭球,Datum是一组用于描述这个椭球的数据集合。最常用的一个Datum是WGS84(World G...

丹追兵 ⋅ 2017/09/20 ⋅ 0

经纬度转换地图坐标api示例代码

经纬度转换地图坐标api支持百度、谷歌、GPS三大经纬度互相转化。 基于php的经纬度转换地图坐标api调用代码实例 <!--?php// +------------------------------------------------------------...

夜晚晚 ⋅ 2016/03/31 ⋅ 0

Google地图百度地图GPS经纬度偏移转换(JAVA)

不多说,直接代码,Java版 主要就是Google地图,百度地图,GPS经纬度偏移转换 GCJ-02转换BD-09,Google地图经纬度转百度地图经纬度 BD-09转换GCJ-02,百度转google WGS-84 到 GCJ-02 的转换(即...

北极心 ⋅ 2015/04/16 ⋅ 3

关于谷歌地图坐标与百度地图坐标的事

解决方案 haotsp.com 有演示示例 众所周知地球是一个不规则椭圆体,GIS中的坐标系定义由基准面和地图投影两组参数确定,而基准面的定义则由特定椭球体及其对应的转换参数确定。 基准面是利用...

李广韬 ⋅ 2013/09/12 ⋅ 0

百度地图API详解之地图坐标系统

我们都知道地球是圆的,电脑显示器是平的,要想让位于球面的形状显示在平面的显示器上就必然需要一个转换过程,这个过程就叫做投影(Projection)。在地球上我们通过经纬度来描述某个位置,而...

postdep ⋅ 2016/03/21 ⋅ 0

简谈百度坐标反转至WGS84的三种思路

文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/ 1.背景 基于百度地图进行数据展示是目前项目中常见场景,但是因为百度地图是基于BD09坐标...

李晓晖 ⋅ 2017/01/03 ⋅ 0

web端定位:获取当前地理位置

方法一:html5原生提供的定位: 讲解:在支持HTML5的浏览器下,navigator对象下有一个属性----geolocation,而geolocation属性又有个方法getCurrentPosition(回调函数1,回调函数2)可以通过浏...

zwjjap ⋅ 2016/05/11 ⋅ 0

移动端地图:屏幕边沿方向指示图标

写在前面 在我们打游戏的时候,队友跑出我们的屏幕可视区域外时,经常会有一个头像图标在屏幕的边沿,并且起着指示队友方向的作用。 在移动端地图应用的开发中,同样可能会有这种需求,下面将...

indulge_in ⋅ 2017/11/23 ⋅ 0

【高德地图API】如何解决坐标转换,坐标偏移?

一、坐标体系 首先我们要明白,开发者能接触到哪些坐标体系呢? 第一种分类: 1、 GPS,WGS-84,原始坐标体系。一般用国际标准的GPS记录仪记录下来的坐标,都是GPS的坐标。很可惜,在中国,任...

hejunbinlan ⋅ 2015/08/07 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

JavaScript零基础入门——(八)JavaScript的数组

JavaScript零基础入门——(八)JavaScript的数组 欢迎大家回到我们的JavaScript零基础入门,上一节课我们讲了有关JavaScript正则表达式的相关知识点,便于大家更好的对字符串进行处理。这一...

JandenMa ⋅ 51分钟前 ⋅ 0

sbt网络问题解决方案

转自:http://dblab.xmu.edu.cn/blog/maven-network-problem/ cd ~/.sbt/launchers/0.13.9unzip -q ./sbt-launch.jar 修改 vi sbt/sbt.boot.properties 增加一个oschina库地址: [reposit......

狐狸老侠 ⋅ 今天 ⋅ 0

大数据,必须掌握的10项顶级安全技术

我们看到越来越多的数据泄漏事故、勒索软件和其他类型的网络攻击,这使得安全成为一个热门话题。 去年,企业IT面临的威胁仍然处于非常高的水平,每天都会看到媒体报道大量数据泄漏事故和攻击...

p柯西 ⋅ 今天 ⋅ 0

Linux下安装配置Hadoop2.7.6

前提 安装jdk 下载 wget http://mirrors.hust.edu.cn/apache/hadoop/common/hadoop-2.7.6/hadoop-2.7.6.tar.gz 解压 配置 vim /etc/profile # 配置java环境变量 export JAVA_HOME=/opt/jdk1......

晨猫 ⋅ 今天 ⋅ 0

crontab工具介绍

crontab crontab 是一个用于设置周期性被执行的任务工具。 周期性执行的任务列表称为Cron Table crontab(选项)(参数) -e:编辑该用户的计时器设置; -l:列出该用户的计时器设置; -r:删除该...

Linux学习笔记 ⋅ 今天 ⋅ 0

深入Java多线程——Java内存模型深入(2)

5. final域的内存语义 5.1 final域的重排序规则 1.对于final域,编译器和处理器要遵守两个重排序规则: (1)在构造函数内对一个final域的写入,与随后把这个被构造对象的引用赋值给一个引用...

江左煤郎 ⋅ 今天 ⋅ 0

面试-正向代理和反向代理

面试-正向代理和反向代理 Nginx 是一个高性能的反向代理服务器,但同时也支持正向代理方式的配置。

秋日芒草 ⋅ 今天 ⋅ 0

Spring 依赖注入(DI)

1、Setter方法注入: 通过设置方法注入依赖。这种方法既简单又常用。 类中定义set()方法: public class HelloWorldOutput{ HelloWorld helloWorld; public void setHelloWorld...

霍淇滨 ⋅ 昨天 ⋅ 0

马氏距离与欧氏距离

马氏距离 马氏距离也可以定义为两个服从同一分布并且其协方差矩阵为Σ的随机变量之间的差异程度。 如果协方差矩阵为单位矩阵,那么马氏距离就简化为欧氏距离,如果协方差矩阵为对角阵,则其也...

漫步当下 ⋅ 昨天 ⋅ 0

聊聊spring cloud的RequestRateLimiterGatewayFilter

序 本文主要研究一下spring cloud的RequestRateLimiterGatewayFilter GatewayAutoConfiguration @Configuration@ConditionalOnProperty(name = "spring.cloud.gateway.enabled", matchIfMi......

go4it ⋅ 昨天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部