地图api

网页中使用js调用百度地图

风流意气都作罢 提交于 2020-04-06 18:01:24
首先得申请一个秘钥,步骤如下:1.百度搜索“ 百度地图开放平台”。 2.然后填写账号登录,没有账号就注册一个,非常简单没什么可说的。3.选择“我的应用”然后创建一个应用。 我们是网页调用,类型默认选服务器浏览器都行,有很多服务默认勾选的一般都足够我们使用了。填完之后提交。 4.然后查看我的应用,复制你的AK。 5.在你的jsp或者html引入链接,就可以调用百度地图接口了。 <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=秘钥"></script>//直接访问一下可以看到返回了一堆js。6.示例。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <style type="text/css"> body, html{width: 100%;height: 100%;margin:0;font-family:"微软雅黑";} #allmap{height:600px;width:1200px;} #r-result{width

在Vue项目种引入百度地图

点点圈 提交于 2020-04-05 19:08:23
http://lbsyun.baidu.com/ 这是申请访问应用(ak)的网站,就是百度地图的开放平台,需要先注册加入百度开发者。 进入 JavaScript API 点击账号和获取密钥,后面有详细步骤,大家应该都有百度账号,然后申请成为百度开发者, 这里正常填写 会给你发送邮件在邮件里激活一下直接点击跳转页面。 正常填写,最底下白名单填一个 * 即可。 成功后在控制台可以看到自己的AK。 剩下的就是代码端的操作了 安装百度地图的插件(项目路径cmd)。 npm install vue-baidu-map 在自己的main.js文件里加上以下内容, AK码填写自己的. import BaiduMap from 'vue-baidu-map' Vue.use(BaiduMap, { ak: 'GpR5245ss5********RRRRVl9' }); 在页面加入以下代码即可 < template > < div > < baidu-map class="map" :center="map.center" :zoom="map.zoom" @ready="handler"> <!--缩放--> < bm-navigation anchor="BMAP_ANCHOR_TOP_LEFT"></ bm-navigation > <!--定位--> < bm-geolocation

【Android】如何申请Android 地图 API 密钥

我是研究僧i 提交于 2020-03-23 16:47:00
1. 首先,要得到你的debug keystore位置: 打开Eclipse--->Windows--->Preferences--->Android--->Build ,查看默认的debug.keystore位置。例如我的位置为(Win7):C:\Users\ShenShuyi\.android。 2. keytool 是Java 提供的一个关于授权的命令 ,使用这个文件的话,要在命令行中定位到JAVA 的bin 目录下。例如我的位置为:D:\Program Files\Java\jdk1.6.0_26\bin。 3. 接下来有: 把debug.keystore文件复制到JAVA的bin目录下,然后再命令行中输入keytool -list -keystore debug.keystore,输入密码:android,便可得到MD5认证指纹信息,如下图所示: 4. 把MD5指纹信息复制到 http://code.google.com/intl/pl/android/maps-api-signup.html 中,点击Gerneratie API Key获得地图的开发密钥。 注意:该开发密钥仅能用于Eclipse上开发测试使用,如果程序需要发布,在真实设备上运行,需要在Eclipse环境中,通过项目的Android Tools>Export Signed Application

FGMap学习之--加载百度地图

杀马特。学长 韩版系。学妹 提交于 2020-03-23 14:38:25
今天我们用FGMap来加载百度地图数据。 从目前国内的地图服务商提供的地图来看,地图瓦片切图规则只少分为三种。其中Google Map、Bing地图、MapABC、QQ地图是一类,而百度地图、搜狗地图是使用的另一类,还有一类应该是mapbar的地图(还没有仔细去分析它的瓦片编号规则)。 第一类FGMap中已经都是集成,这里就不再说了,今天说说第二类:百度地图。前几天看到狮兄写的 百度地图Silverlight版和Flex版(via SuperMap iClient) ,里面有一个例子是用Flex写的,可能是我的知识有限,没有太明白他说的内容。但大体知道他说的瓦片组织的方式需要用一个偏移量,所以今天特意去BaiduMap 的API里看看了,发现有一个很有意义的信息,在开发指南->地图图层->自定义图层有这么一段话: 经纬度是一种利用三维空间的球面来定义地球上的空间的球面坐标系,它能够标示地球上任何一个位置。通过伦敦格林尼治天文台原址的经线为0度经线,从0度经线向东、向西各分180度。赤道为0度纬线,赤道以北的纬线称为北纬、以南的称为南纬。在百度地图中,东经和北纬用正数标示,西经和南纬用负数标示。 使用百度地图和谷歌地图进行了一个对比,可能大家更能明白些: 从上图中可以出来,百度是以经纬度0,0开始编号,向东X正增加,向西X负增加,向北Y增加,向南Y负增加,而谷歌地图是从左上角开始编号

Google地图接口API之申请免费API Key(一)

大城市里の小女人 提交于 2020-03-20 23:21:31
使用谷歌地图API V3创建交互式地图,首先需要拥有一个免费的 Google 地图 API key。 如果想调用Google地图的接口,首先需要拥有一个免费的 Google 地图 API key。想要拥有一个免费的API Key,首先得拥有一个Google账号。想要申请Google的账号,首先得能访问Google的网站注册Gmail。目前在大陆已经很难访问Google的网站了,怎么访问Google的网站不是这里的重点,假设你已经能够访问Google的网站,并且具有一个Google的账号了。接下来说说怎么在Google上面申请免费的Google地图API Key。 首先,访问 https://code.google.com/apis/console/ , 使用你的Google账号登陆。 登陆后成功后会出现如下界面: 点击 "Create Project" 按钮。 在服务列表中找到 搜索 Google Maps API v3,点击 Google Maps JavaScript API v3,如下所示: 然后点击"启用API",让其开启该服务器,如下所示: 启用之后如下图所示。 点击" 前往 API 主控台查看報表 " 之后跳转到如下页面: 点击左侧列表中的"Api Access",找到下方的"create new Server key",点击打开,随便输入内容,不输入也无所谓。

高德地图API之驾车路线

喜你入骨 提交于 2020-03-07 19:16:33
驾车路线 引入插件 AMap.Driving <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=ce3b1a3a7e67fc75810ce1ba1f83c01a&plugin=AMap.Driving,AMap.Autocomplete"></script> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>map</title> <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=ce3b1a3a7e67fc75810ce1ba1f83c01a&plugin=AMap.Driving"></script> <style> *{margin:0;padding:0;list-style: none;} #container {width:100%; height: 100%;top:0;left:0;position: absolute; } #panel{position: fixed;width:280px;top:10px;right:10px;background-color:

生成百度地图

心不动则不痛 提交于 2020-03-07 06:11:58
http://api.map.baidu.com/lbsapi/creatmap/网址 一步步 注册百度帐号获取密钥即可 <!--百度地图容器--> <!--引用百度地图API--> <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=LNr5D7cir4efHvWX67rpknIe"></script> <div style="width:99%; margin:auto; margin-bottom:40px; height:400px;border:#fff solid 5px;font-size:12px;" id="map"></div> <script type="text/javascript"> //创建和初始化地图函数: function initMap(){ createMap();//创建地图 setMapEvent();//设置地图事件 addMapControl();//向地图添加控件 addMapOverlay();//向地图添加覆盖物 } function createMap(){ map = new BMap.Map("map"); map.centerAndZoom(new BMap.Point(117.148353,36.671086),16); }

【Vue】疫情实时数据及地图 Vue + Echarts + vxeTable

血红的双手。 提交于 2020-03-05 01:01:31
本期内容 使用 Vue + Echarts + vxeTable 搭建前端展示界面,接口请求示例是腾讯肺炎疫情实时动态页面中的开放接口 知识基础 如何在 Vue 中引入 Echarts,点 这里 如何在 Vue 中引入 vxeTable,点 这里 部分效果 国家和地区数据 我国省份数据​​ 一、申请百度地图 ak 以使用 Echarts 地图 1、申请 ak ① 进入 http://lbsyun.baidu.com/ ② 登录后点击 控制台 ③ 按要求操作后,点击申请 密钥 ④选择 浏览器端 ⑤保存好 ak 2、创建 map.js 文件调用 BMap ① 建立 map.js 文件 ② 在 map.js 中将申请的 ak 填入下方函数中 export function MP () { const ak = '...' // 这里填的是你自己的 ak return new Promise(function (resolve, reject) { window.init = function () { resolve(BMap) } var script = document.createElement('script') script.type = 'text/javascript' script.src = `http://api.map.baidu.com/api?v=2.0&ak

vue中如何使用高德地图

▼魔方 西西 提交于 2020-03-03 01:16:28
vue中使用高德地图api 引入高德js api webpack配置高德api 组件中使用高德api 引入高德js 首先注册高德api帐号,申请到key 然后在vue-cli创建的 html中引入 webpack配置高德api vue-cli 3.0 之后webpack的配置使用了vue.config.js来配置 在vue.config.js中添加如下代码, module . exports = { configureWebpack : { externals : { BMap : "BMap" } } } ; webpack配置高德api < template > < div style = "height: 100%" > < div id = "mapContainer" style = "width: 100%;height: 100%" > < / div > < / div > < / template > < script > import AMap from 'AMap' import { getInitData } from "../../api/map" import { MessageError } from "../../utils/util" export default { name : "Map" , data ( ) { return { map :

js 百度地图

扶醉桌前 提交于 2020-03-02 10:33:16
百度地图JavaScript API http://lbsyun.baidu.com/index.php?title=jspopular JavaScript API v2.0类参考 http://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference.html Demo参考 https://www.cnblogs.com/gzbit-zxx/p/10808957.html 来源: https://www.cnblogs.com/enych/p/12393935.html