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)

最新文章

  1. JS实现HTML标签转义及反转义
  2. angular.js中插值语法和ng-bind以及ng-model的区别
  3. 汇编 int10h(转)
  4. 电赛总结(二)&mdash;&mdash;AD芯片总结之AD7705
  5. 如何通过apt-get获得安装包的源码
  6. display:box和flex的区别
  7. debian系(Ubuntu)安装jenkins(持续集成)
  8. Vue 中动态添加class(使用v-bind:class)
  9. Jade是变体的HTML
  10. Mybatis笔记一:写一个demo
  11. Java基础总结01:JDK与JRE概述
  12. 企业网管用linux搭建邮件服务器为公司降本增效
  13. k8s pv 的三种挂载模式
  14. 只打开一次浏览器,生成html测试报告&lt;小紧张中......&gt;
  15. 在ado.net中实现oracle存储过程调用两种方式
  16. iOS:第三方库使用非ARC编译
  17. Node.js安装备忘录
  18. javascript高级程序设计第一章
  19. windows挂载网络盘
  20. VC+++ 操作word

热门文章

  1. python format函数的使用
  2. Linux下tomcat启动慢,阻塞
  3. Python集成开发环境Pycharm+Git+Gitee(码云)
  4. php &amp;引用符的注意情况
  5. shiro安全框架的使用流程
  6. Spring学习笔记(4)——IoC学习
  7. docker部署一个简单的mian.py项目文件
  8. ASP.NET MVC 学习笔记之面向切面编程与过滤器
  9. Codeforces 1111E DP + 树状数组 + LCA + dfs序
  10. Codeforces 319C DP 斜率优化