web开发调用百度地图API + AK申请
2024-08-28 07:47:01
web开发调用百度地图API + AK申请
要使用百度地图的API我们首先需要在我们的html页面引入js----``
如何获取百度地图ak:
- 1.登陆百度地图开发者平台
- 2.注册百度开发者账号并登陆
- 3.点击进入控制台创建应用,需要注意的是:“Referer白名单”这个字段填写你客户端的ip,不然最后的ak依然无法调用,当然也可以是网站,代表这个ak允许那些客户端使用
基本的准备工作到这里就结束了,下面看看调用代码:
```
Hello, World
html{height:100%}
body{height:100%;margin:0px;padding:0px;display: flex;justify-content: center;align-items: center;}
#container{
height:80%;
border: 10px inset darkgoldenrod;
}
<body>
<div id="container" class="container"></div>
<script type="text/javascript">
var map = new BMap.Map("container");
// 创建地图实例
var point = new BMap.Point(108.188512, 31.23829);
// 创建点坐标
map.centerAndZoom(point, 19);
// 初始化地图,设置中心点坐标和地图级别
map.enableScrollWheelZoom(true);
// 滚动缩放
// var myStyleJson=[
// {
// "featureType": "road",
// "elementType": "geometry.stroke",
// "stylers": {
// "color": "#ff0000"
// }
// }];
// map.setMapStyle({styleJson: myStyleJson });
//风格
map.addEventListener("click", function(e){
var lat = e.point.lat;
var lng = e.point.lng;
console.log('东经'+lng, '北纬'+lat);
});
```
好了具体玩法参照百度地图API就可以了,这里做一个记录:老家的经纬度是(108.188512, 31.23829)
最新文章
- JS实现HTML标签转义及反转义
- angular.js中插值语法和ng-bind以及ng-model的区别
- 汇编 int10h(转)
- 电赛总结(二)&mdash;&mdash;AD芯片总结之AD7705
- 如何通过apt-get获得安装包的源码
- display:box和flex的区别
- debian系(Ubuntu)安装jenkins(持续集成)
- Vue 中动态添加class(使用v-bind:class)
- Jade是变体的HTML
- Mybatis笔记一:写一个demo
- Java基础总结01:JDK与JRE概述
- 企业网管用linux搭建邮件服务器为公司降本增效
- k8s pv 的三种挂载模式
- 只打开一次浏览器,生成html测试报告<;小紧张中......>;
- 在ado.net中实现oracle存储过程调用两种方式
- iOS:第三方库使用非ARC编译
- Node.js安装备忘录
- javascript高级程序设计第一章
- windows挂载网络盘
- VC+++ 操作word