js 地理位置查询经纬度定位地图

<html xmlns="http://www.w3.org/1999/xhtml">
<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>
</head>
<body style="background:#CBE1FF"><div style="width:730px;margin:auto;">   要查询的地址：<input id="text_" type="text" value="烟台三水大厦" style="margin-right:100px;"/>查询结果(经纬度)：<input id="result_" type="text" /><input type="button" value="查询" οnclick="searchByStationName();"/><div id="container" style="position: absolute;margin-top:30px; width: 180px; height: 180px; top: 50; border: 1px solid gray;overflow:hidden;"></div></div>
</body>
<script type="text/javascript">var map = new BMap.Map("container");map.centerAndZoom("烟台", 12);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 localSearch = new BMap.LocalSearch(map);localSearch.enableAutoViewport(); //允许自动调节窗体大小
function searchByStationName() {map.clearOverlays();//清空原来的标注var keyword = document.getElementById("text_").value;localSearch.setSearchCompleteCallback(function (searchResult) {var poi = searchResult.getPoi(0);document.getElementById("result_").value = poi.point.lng + "," + poi.point.lat;map.centerAndZoom(poi.point, 13);var marker = new BMap.Marker(new BMap.Point(poi.point.lng, poi.point.lat));  // 创建标注，为要查询的地方对应的经纬度map.addOverlay(marker);var content = document.getElementById("text_").value + "<br/><br/>经度：" + poi.point.lng + "<br/>纬度：" + poi.point.lat;var infoWindow = new BMap.InfoWindow("<p style='font-size:14px;'>" + content + "</p>");marker.addEventListener("click", function () { this.openInfoWindow(infoWindow); });// marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画});localSearch.search(keyword);
}
</script>
</html>

js 地理位置查询经纬度定位地图相关推荐

微信小程序定位开发逆地理位置查询经纬度获取位置名称
一. 微信小程序获取用户定位==>经纬度(官方) (1)官方方法:wx.getLocation(Object object) (2)官方链接:https://developers.weixin. ...
地图叠加图片切片：通过输入经纬度定位地图配准点
新版切片工具说明及下载页面 >>> 如果地图上没有明显的标志物,例如在偏远乡村.山区.沙漠.高原无人区,如何使用配准法定位覆盖图片的位置?现在可以通过输入经纬度的方式定位地图上的点, ...
使用python实现地理位置查询经纬度
地理编码工具geocoder 地理编码工具geocoder,不同厂商的服务整合统一起来地理编码 import geocoder g = geocoder.google("1403 Wash ...
html地图根据坐标定位,百度地图js根据经纬度定位和拖动定位点
&lt我自址哈这工边识框处己按后大都加控不架的;/scrip比抖朋要插支一圈不者地器享说几t> 定位 body, html, #allmap { width: 100%; height: ...
oracle经纬度精确查询位置,用NodeJS实现批量查询地理位置的经纬度接口
实现步骤 1. 查询接口网站上这种类型的接口还不少,笔者直接找了百度地图的接口做,接口文档,调用的API是Geocoding API中的地理编码服务请求示例:对北京市百度大厦进行地理编码查询 ht ...
调用腾讯地图API、高德地图API 获取当前地理位置、经纬度
调用腾讯地图API.高德地图API 获取当前地理位置.经纬度 web开发中,很多情况下都会需要获取当前位置的经纬度,在网上找了几个不同的地图,最终找到兼容比较好的腾讯地图API 1.调用腾讯地图API ...
利用百度地图通过位置名称查询经纬度方法总结
这段时间公司做大数据统计,需要用到百度地图,并且需要将数据的点位(也就是数据对应的位置)通过经纬度来在地图上进行描点.但是不能单纯用一种方法进行描点,后台定时器也需要调用查看,下面我就简单介绍前后台两 ...
百度地图地址查询经纬度插件vue-baidu-map
效果 npm install vue-baidu-map --save 组件使用 <queryBaidu:visible.sync="visible1"v-if=" ...
app 隔几秒记录当前经纬度位置_经纬度查询app下载-经纬度查询(在线定位查询)官方版下载v3.6...
经纬度查询是一款在线定位查询的app,一键快速的获取位置,并且智能的系统还能够进行高德地图的切换,手机上查询也比较的方便,高清的画质,用户在使用的时候非常的清晰,同时还可以了解纬度值的精准信息哦!赶紧 ...

js 地理位置查询经纬度定位地图

js 地理位置查询经纬度定位地图相关推荐

最新文章

热门文章