百度地图API： http://api.map.baidu.com/lbsapi/cloud/
开发前需要先申请密钥（key)
在访问位置信息前，浏览器都会询问用户是否共享其位置信息，以 Chrome 浏览器为例，如果您允许 Chrome 浏览器与网站共享您的位置，Chrome 浏览器会向 Google 位置服务发送本地网络信息，估计您所在的位置。然后，浏览器会与请求使用您位置的网站共享您的位置。
经过测试发现，目前的浏览器定位技术依然不靠谱，误差很大，基本没有实用性。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;}
#l-map{height:100%;width:78%;float:left;border-right:2px solid #bcbcbc;}
#r-result{height:100%;width:20%;float:left;}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.5&ak=8704bb2733e7bbfd5fbd7ddb73861d87"></script>
<title>地图官网展示效果</title>
</head>
<body>
<div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
var map = new BMap.Map("allmap"); // 创建Map实例
var enableBaiduLocation = false; //暂时不用百度自带的浏览器定位接口
if(enableBaiduLocation) {
var point = new BMap.Point(116.331398,39.897445);
map.centerAndZoom(point,15);
var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(function(r){
if(this.getStatus() == BMAP_STATUS_SUCCESS){
var mk = new BMap.Marker(r.point);
map.addOverlay(mk);
map.panTo(r.point);
alert('您的位置：'+r.point.lng+','+r.point.lat);
}
else {
alert('failed'+this.getStatus());
}
},{enableHighAccuracy: true})
} else {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(successFunction, errorFunction, {
enableHighAcuracy: true,
timeout: 5000
});
} else {
alert('It seems like Geolocation, which is required for this page, is not enabled in your browser. Please use a browser which supports it.');
}
}
function successFunction(position) {
var latitude = position.coords.latitude; //维度
var longitude = position.coords.longitude; //经度
var curPoint = new BMap.Point(longitude, latitude);
map.centerAndZoom(curPoint, 15); // 初始化地图,设置中心点坐标和地图级别
map.addControl(new BMap.NavigationControl()); // 添加平移缩放控件
map.addControl(new BMap.ScaleControl()); // 添加比例尺控件
map.addControl(new BMap.OverviewMapControl()); //添加缩略地图控件
map.enableScrollWheelZoom(); //启用滚轮放大缩小
map.addControl(new BMap.MapTypeControl()); //添加地图类型控件
map.setCurrentCity("成都"); // 设置地图显示的城市 此项是必须设置的
var marker1 = new BMap.Marker(curPoint); // 创建标注
map.addOverlay(marker1); // 将标注添加到地图中
map.addEventListener("click",function(e){
alert("点击坐标：" + e.point.lng + "," + e.point.lat);
});
}
function errorFunction() {
alert("error");
}
</script>
分享到：
相关推荐
这个"百度地图JavaScriptAPI离线版.zip"文件包含了一整套用于离线环境使用的API资源，对于那些网络不稳定或者需要在无网络环境下使用地图功能的应用来说非常有用。 首先，我们来详细了解一下百度地图JavaScript API...
压缩包子文件的文件名“百度地图JavaScriptAPI离线版20190822”表明这是2019年8月22日版本的API，可能包含了该日期前的所有更新和修复。 综合以上信息，我们可以了解到以下知识点： 1. **百度地图JavaScript API**...
百度地图JavaScript API 是一个强大的工具，它允许开发者在网页上集成地图功能，包括地图展示、定位、路径规划等。在这个案例中，我们有两个关键的文件：`traceDraw.jsp` 和 `personTraceMap.jsp`，它们分别用于绘制...
百度地图JavaScript API是百度提供的一款强大的地图开发工具，主要用于在网页上实现地图的展示、交互以及自定义功能。离线版则是针对那些需要在没有网络连接或者网络环境不稳定的情况下使用地图服务的开发者设计的。...
在本文中，我们将深入探讨如何使用jQuery与百度地图API结合，实现美团外卖配送地址的定位功能。这个功能对于在线订餐平台来说至关重要，因为它能够帮助用户快速准确地输入或选择他们的配送地址，从而提高用户体验。 ...
"百度地图javascript API + 调用封装javascript" 指的是使用百度地图提供的JavaScript接口，结合自定义的JavaScript代码，对这些API进行封装，以简化地图功能的调用过程，提高代码的可维护性和复用性。这种封装通常...
百度地图API提供了丰富的地理信息服务，包括地图展示、定位、路径规划等。对于热力地图的生成，我们需要重点关注其“热力图层”服务。在Python中，我们通常会借助requests库来发送HTTP请求获取百度地图API的服务数据...
本教程将详细介绍如何利用百度地图Web API实现移动地图的中心定位、拖动地图以及周边信息显示等特性。 首先，"中心定位"是地图应用的基本功能。在百度地图Web API中，我们可以使用`BMap.CenterAndZoom`方法来设置...
1. **百度地图API**：百度地图API是百度公司提供的一套Web服务接口，允许开发者在其网站或应用中嵌入地图功能，包括地图显示、定位、路径规划等。通过JavaScript API，开发者可以轻松地与百度地图进行交互，创建丰富...
它允许开发者通过JavaScript编程语言来与百度地图进行交互，实现地图显示、定位、标注、路线规划等多种功能。离线版本则意味着所有的地图数据和功能都已存储在本地，无需依赖互联网连接，这对于那些在网络不稳定或者...
一、引入百度地图JavaScript库 在HTML文件中，我们需要引入百度地图的JavaScript库。通常我们使用CDN链接，如下： ```html <script src="http://api.map.baidu.com/api?v=3.0&ak=你的API密钥"> ``` 二、初始化...
百度地图JavaScript API是一个强大的工具，允许开发者在网页中集成地图功能，包括定位、标注、路线规划、地图样式定制等。这个API适用于各种应用场景，如交通导航、生活服务、旅游景点展示等。在你提供的压缩包中，...
百度地图离线API是开发者们在无网络环境下，仍能实现地图展示、定位、路径规划等功能的重要工具。这个“最新百度地图离线API”提供了一套完整的解决方案，使开发者能够在本地环境中进行地图应用的开发和测试，无需...
百度地图JavaScript API是一套由JavaScript语言编写的应用程序接口，它能够帮助您在网站中构建功能丰富、交互性强的地图应用程序。百度地图API不仅包含构建地图的基本功能接口，还提供了诸如本地搜索、路线规划等...
总结，通过百度地图API与JavaScript的结合，我们可以实现丰富的地图应用，包括但不限于地图展示、定位、标记、数据加载、路径规划等。这个过程中，Ajax用于动态获取数据，使地图功能更加灵活和动态。记住，正确配置...
微信小程序百度地图JavaScript API v1.0 是一个用于在微信小程序中集成百度地图服务的开发工具包。这个API集成了百度地图的各种功能，使开发者能够方便地在微信小程序环境中实现地图展示、定位、路线规划等操作。...
百度地图API是百度提供的一个JavaScript库，它允许开发者在网页上嵌入地图，进行地图交互，以及实现各种与地理位置相关的功能。这个API提供了丰富的接口和组件，使得开发者能够轻松地集成地图功能到自己的项目中。 ...
2. **JavaScript API**：这个Demo很可能使用了百度地图JavaScript API，这是一个在Web浏览器环境中使用的接口，开发者可以通过编写JavaScript代码调用API，实现地图显示、定位、标记、信息窗口等功能。 3. **授权和...
在本案例中，我们将利用这一特性，通过调用百度地图API来实现地图的展示、定位、导航等功能。 第一步，我们需要在MFC项目中添加WebBrowser控件。这通常通过在对话框资源编辑器中拖放或编程方式添加完成。一旦控件...