调用百度地图api
一篇很详细的调用百度api教程
·
首先进入百度地图api官网:
然后创建应用
注意,要是在浏览器端访问一定要选择浏览器端, 不要选服务端, 其他的按照步骤来就行了
创建好之后, 选择开发文档,可以看到面向各种操作系统和平台的服务
我以Web开发的JavaScript API来演示
先写最简单的Hello World, 点击右侧的Hello World
这时看文档大概也知道怎么做了吧, 下面直接上我的代码, 注意一定要是自己的密钥
<!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>Hello, World</title>
<style type="text/css">
html{height:100%}
body{height:100%;margin:0px;padding:0px}
#container{height:100%}
</style>
<script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&type=webgl&ak=您的密钥">
</script>
</head>
<body>
<div id="container"></div>
</body>
<script type="text/javascript">
var map = new BMapGL.Map("container");
// 创建地图实例
var point = new BMapGL.Point(116.404, 39.915);
// 创建点坐标
map.centerAndZoom(point, 15);
// 初始化地图,设置中心点坐标和地图级别
map.enableScrollWheelZoom(true);
// 开启鼠标滚轮缩放
</script>
</html>
然后就调用成功啦, Hello World!
但有时候可能会报如下错误: A parser-blocking, cross site (i.e. different eTLD+1) script
不要怀疑,一定是引入api的链接错了, 仔细检查有没有各个参数: v, type, ak, 修改过来就好了
其他的用法都在左侧栏列表里, 可以一个一个地进行尝试
更多推荐
🚀API 研发管理和自动化测试高效工具
活动日历
查看更多
活动时间 2023-08-23 00:00:00

教程|Eolink Apikit 快速入门
活动时间 2023-07-04 00:00:00

【活动】Eolink「AI+API」新功能正式开放内测!
直播时间 2023-03-23 18:44:14

API设计最佳实践|高效简洁的团队沟通与API安全的防护巩固
直播时间 2022-12-15 18:30:18

Devops与工具链|云原生技术助力现代化软件开发技术革命

【下载】最佳实践手册结合Eolink在业内多年的实践经验,整理了API全生命周期中遇到的挑战及如何使用Eolink产品。
所有评论(0)