调用百度地图API获取经纬度(详细步骤)

前端调用百度地图API获取经纬度(详细操作)

1. 浏览器搜索百度地图开放平台

2. 创建应用

点击控制台 --> 应用管理 --> 我的应用 --> 注册账号(如果没有注册过) --> 创建应用

填写应用名称 --> 应用类型选择浏览器端 --> Referer白名单填 * --> 点击提交

回到我的应用 --> 复制访问应用（AK）

3. 使用API获取经纬度

这里使用的是百度地图v1.0

<!DOCTYPE html>
<html>
<head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>百度地图</title> <style type="text/css"> html{height:100%} body{height:100%;margin:0px;padding:0px} #container{width: 800px;height: 600px;} /* 去掉版权显示 */.BMap_cpyCtrl {display:none;}.anchorBL{display:none;}</style> <script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&type=webgl&ak=刚刚复制的AK"></script>
</head> <body> <div id="container"></div><script type="text/javascript">// 创建地图实例 let map = new BMapGL.Map("container");// 创建点坐标 let point = new BMapGL.Point(116.39515671900338, 39.93181962772638);map.centerAndZoom(point, 15);//启用滚轮放大缩小，默认禁用。map.enableScrollWheelZoom(true);// 添加比例尺控件let scaleCtrl = new BMapGL.ScaleControl();  let zoomCtrl = new BMapGL.ZoomControl();  map.addControl(scaleCtrl);map.addControl(zoomCtrl);// 添加城市列表控件let cityCtrl = new BMapGL.CityListControl();  map.addControl(cityCtrl);// 添加标记点let marker = new BMapGL.Marker(point);map.addOverlay(marker);//地图单击事件map.addEventListener("click", function(e){// 清除覆盖物map.clearOverlays();// 重设标记点let point = new BMapGL.Point(e.latlng.lng, e.latlng.lat);let marker = new BMapGL.Marker(point);map.addOverlay(marker);//信息窗口配置let opts = {width: 250,     // 宽度height: 100,    // 高度title:'经纬度信息' //标题}let info = `当前位置经度为${e.latlng.lng}，纬度为${e.latlng.lat}`// 创建信息窗口对象let infoWindow = new BMapGL.InfoWindow(info, opts);  // 打开信息窗口map.openInfoWindow(infoWindow, point);        });</script>
</body>
</html>

4. 实现效果

5.其他功能

如果想实现其他功能，可自行阅读开发文档，注意版本之间的区别

调用百度地图API获取经纬度(详细步骤)相关推荐

Python3 | 通过百度地图API获取商家详细信息（包括店名，地址，经纬度，电话）
一.打开百度地图开放平台,选择Web服务API . 官方文档对API接口的调用描述的比较详细,在调用之前先要申请百度地图的账号,然后申请密钥,获取密钥的步骤官方也有说明. 二.通过百度地图 ...
qichacha/知乎/国家统计局最新4级地区划/百度地图API获取经纬度/Google play app评论等分数据爬取
1.企查查数据抓取 1.1 关键公司LOGO # -*-coding:utf-8-*-import pandas as pd import requests import json import ra ...
c语言api获取百度地图,H5调用百度地图API获取地理位置
//获取当前位置 var geolocation = new BMap.Geolocation(); geolocation.getCurrentPosition(function(r){ alert ...
HTML5页面调用百度地图API,获取当前位置并导航到目的地
微信也可用, <!DOCTYPE html> <html lang="zh-cmn-Hans"><meta charset="UTF-8&q ...
【百度地图】——百度地图API获取经纬度、地址及周边兴趣点
在做一个电商项目过程中,需要获取设备地理信息,包括经纬度定位,附近地址等,于是写了一个工具类方便使用. 1.在使用百度地图API使,首先要获取官方授权,在http://lbsyun.baidu.com ...
如何将百度地图API获取经纬度写成公有方法？
原问题来自于CSDN问答社区:http://ask.csdn.net/questions/636 问题描述: 我使用的是百度地图API来获取经纬度坐标.但是我的程序里面有多个地方用到了经纬度. 所以我 ...
C# 调用高德地图API获取经纬度以及定位，JS获取定位【万字详解附完整代码】
最近有个需求,需要用到定位,本来打算用百度地图API定位,但是发现百度地图定位申请AppKey太麻烦了.因为是写的web端,百度地图定位API申请的Appkey需要网址过滤.索性就用高德定位了(有一说 ...
php 百度地图api获取经纬度,调用百度地图API接口获取地铁站的经纬度信息
今天我们来看一下,如何通过百地图API来获取地点的经纬度.首先百度地图提供了强大的API接口,我们可以通过调用它来实现目的.这是网址:https://lbsyun.baidu.com/.首先想要调用A ...
php批量获得经纬度,批量调用百度地图API获取地址经纬度坐标
1 申请密匙点击左侧 "获取密匙" ,经过填写个人信息.邮箱注册等,成功之后在开放平台上点击"创建应用",填写相关信息,在这里特别说明的是,在IP白名单框里, ...

调用百度地图API获取经纬度(详细步骤)

前端调用百度地图API获取经纬度(详细操作)

1. 浏览器搜索百度地图开放平台

2. 创建应用

3. 使用API获取经纬度

4. 实现效果

5.其他功能

调用百度地图API获取经纬度(详细步骤)相关推荐

最新文章

热门文章