百度地图JavaScript API经纬度查询-MAP
百度地图JavaScript API经纬度查询-MAP-ABCDEFGHIJKMHNOPQRSTUVWXYZ:
搜索:<input type="text" size="20" name="keyword" id="keyword" /> <input type="submit" value="提交" onclick="MblogDotccMap(document.getElementById('keyword').value)" />
<!--
更多技术分享请看博客:http://blog.csdn.net/fuyifang
-->
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>百度地图Demo-更多技术分享请看博客:http://blog.csdn.net/fuyifang</title>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
</head>
<body>
<div style="width: 520px; height: 340px; border: 1px solid gray" id="container">
</div>
</body>
</html>
<script type="text/javascript">
var map = new BMap.Map("container"); //初始化地图
var opts = { type: BMAP_NAVIGATION_CONTROL_LARGE }; //初始化地图控件
map.addControl(new BMap.NavigationControl(opts));
var point = new BMap.Point(121.48, 31.22); //初始化地图中心点
var marker = new BMap.Marker(point); //初始化地图标记
marker.enableDragging(); //标记开启拖拽
var gc = new BMap.Geocoder();
//添加标记拖拽监听
marker.addEventListener("dragend", function (e) {
//获取地址信息
gc.getLocation(e.point, function (rs) {
showLocationInfo(e.point, rs);
});
});
//添加标记点击监听
marker.addEventListener("click", function (e) {
gc.getLocation(e.point, function (rs) {
showLocationInfo(e.point, rs);
});
});
map.centerAndZoom(point, 15); //设置中心点坐标和地图级别
map.addOverlay(marker); //将标记添加到地图中
//显示地址信息窗口
function showLocationInfo(pt, rs) {
var opts = {
width: 250, //信息窗口宽度
height: 100, //信息窗口高度
title: "" //信息窗口标题
}
var addComp = rs.addressComponents;
var addr = "当前位置:" + addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber + "<br />";
addr += "纬度: " + pt.lat + ", " + "经度:" + pt.lng;
//alert(addr);
var infoWindow = new BMap.InfoWindow(addr, opts); //创建信息窗口对象
marker.openInfoWindow(infoWindow);
}
function MblogDotccMap(keyword) {
//搜索
var local = new BMap.LocalSearch(map,
{ renderOptions: { map: map, panel: "results_info" }
}
);
map.panBy(point);
local.search(keyword);
local.getResults()
local.setSearchCompleteCallback(function (searchResult) {
var poi = searchResult.getPoi(0);
//alert(poi.point.lng+" "+poi.point.lat);
//document.getElementById("info").innerHTML = "<strong>" + keyword + "</strong>" + "坐标:" + poi.point.lng + "," + poi.point.lat;
});
}
</script>
<div id="results_info"></div>
搜索:<input type="text" size="20" name="keyword" id="keyword" /> <input type="submit" value="提交" onclick="MblogDotccMap(document.getElementById('keyword').value)" />
<!--
更多技术分享请看博客:http://blog.csdn.net/fuyifang
-->
百度地图JavaScript API经纬度查询-MAP的更多相关文章
- 百度地图JavaScript API使用
最近在完成优达学城前端开发(入门)课程的P4项目中,要求调用google地图进行交互,项目已提供部分js代码和html代码.但在申请google地图API密钥时由于网络等原因,打不开或者连接超时,所以 ...
- 百度地图JavaScript API覆盖物旋转时出现偏移
在项目中,调用百度地图JavaScript API,做覆盖物的旋转再添加到地图上,结果出现偏移了. 调试过程中的效果图: 发现图片的旋转并不是按车子的中心来的,而是之外的一个点.最后发现犯了一个很细节 ...
- 【百度地图JavaScript API】手机端浏览器定位的实现
[百度地图JavaScript API]手机端浏览器定位的实现 https://blog.csdn.net/xiao190128/article/details/72579476
- 百度地图JavaScript API获取用户当前经纬度和详细地理位置,反之通过详细地理位置获取当前经纬度
前言: 前端时间刚好使用了百度地图的js api定位获取用户当前经纬度并获取当前详细位置和通过当前用户详细地理位置换取用户当前经纬度坐标的功能,为了方便下次找起来方便一些自己在这里记录一下,希望也能够 ...
- 百度地图 JavaScript API 极速版 开发体会
前段时间百度地图API推出了 JavaScript API 极速版 1.0 简单看了一下,从产品定位来说真是挺好. 把开发人员细分成普通web开发人员和移动web开发人员.正好用到了手机地图这块决定尝 ...
- 百度地图JavaScript API自定义覆盖物、自定义信息窗口增删时的显示问题
项目中,需求:在百度地图上实时画出车辆,并能点击车辆弹出信息框查看实时信息. 实现:通过不停的画覆盖物并删除掉.点击覆盖物时弹出信息窗口. 问题:删除掉覆盖物后信息窗也删除掉了.因为信息窗是建立在覆盖 ...
- 百度地图JavaScript API本地搜索的结果面板
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- 百度地图 JavaScript API
最近有点懒 项目结尾了 完了好长时间 没有去总结项目中的问题 想了下还是写写吧 这是一个关于百度地图的 网页展示 <!DOCTYPE html><html><head ...
- 百度地图 Javascript API 笔记
因为最近的一个项目用到,所以自己整理了一下遇到的一些坑 自己写了一个类库来二次封装用于调起常用的功能:https://github.com/iRuxu/iBMap 快速文档链接 Javascript ...
随机推荐
- 终于放弃Windows下丑陋的cmd
微软万年不变的cmd命令行工具,简直其丑无比,交互性极差.但是作为开发者有时离不开.最近用了几款开源替代方案.发现几款不错的cmd替代者.例如Cmder.babun.ConsoleZ.win-bash ...
- BZOJ 4569: [Scoi2016]萌萌哒 [并查集 倍增]
传送门 题意:长为$n \le 10^5$的数字,给出$m \le 10^5$个限制$[l1,r1]\ [l2,r2]$两个子串完全相等,求方案数 把所有要求相等的位置连起来,不就是$9*10^{连通 ...
- 洛谷3月月赛 R1 Step! ZERO to ONE
洛谷3月月赛 R1 Step! ZERO to ONE 普及组难度 290.25/310滚粗 t1 10分的日语翻译题....太难了不会... t2 真·普及组.略 注意长为1的情况 #include ...
- 2019/1/10 redis学习笔记(二)
本文不涉及集群搭建操作 关于在lua脚本中操作redis的应用场景 大家都知道redis对于单个集合的操作是原子性的;但是有可能有一种场景是这样.比如说抢红包,现在有十个人抢五份红包,抽象到我们jav ...
- Windows Server 2016-部署额外域控制器
我们一般所提到的所谓域外控制器,是指除域内第一台域控制器之外的其他域控制器.额外域控制器很多时候也有辅助域控一称.那么在同一域内安装多台域控制器有什么优点呢: 1.提高用户登录效率.多台域控制器可以同 ...
- php语言基础(一)
一.php标记风格 1.1xml风格(常用) <?php echo "xml风格": ?> 1.2脚本风格 <script language="php& ...
- windows搭建web服务器
1.安装web管理工具 控制面板--->程序和功能--->打开或关闭功能 2.将internet信息服务中的所有选项全部勾上,并点击确定. 3.打开浏览器,输入http://localho ...
- WPF字典集合类ObservableDictionary
WPF最核心的技术优势之一就是数据绑定.数据绑定,可以通过对数据的操作来更新界面. 数据绑定最经常用到的是ObservableCollection<T> 和 Dictionary<T ...
- HashMap原理阅读
前言 还是需要从头阅读下HashMap的源码.目标在于更好的理解HashMap的用法,学习更精炼的编码规范,以及应对面试. 它根据键的hashCode值存储数据,大多数情况下可以直接定位到它的值,因而 ...
- Window Server 布署 WCF 服务 , 权限配置问题
起因: 客户服务器运行环境要求提高安全性,建议数据连接串采取 加密措施 ,或改用 Window 验证 连接数据库服务 .于是我们打算选择后着,将后台服务(Window Server)数据库连接串调整为 ...