怎么在html中调用百度地图的api

html-css017

怎么在html中调用百度地图的api,第1张

首先打开百度地图开放平台

点击开发菜单,选择地图生成器;

切换城市;

输入具体地理位置名称,比如平凉市汽车东站,点击查找定位经纬度;

点击设置地图;具体参数,可自由设置;

添加标注,鼠标点击点标记图标,然后在地图中找到具体位置,点击鼠标左键进行标注;

输入标记名称,和备注,点击保存;

预览;

点击获取代码,然后复制代码;将代码粘贴到新建的HTML中保存即可使用。

引用jquery,有很方便的GET调用方法:

<!DOCTYPE html>

<html>

<head>

    <meta http-equiv="content-type" content="text/html charset=UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- src值为文件位置路径 -->

    <script type="text/javascript" charset="UTF-8" src="javascript/jquery-1.12.1.js"></script>

    <title>测试案例</title>

    <!-- 语法:jQuery.getJSON(url,data,success(data,status,xhr)) -->

    <script type="text/javascript" charset="UTF-8">

        function getToken(){

            $.getJSON("http://localhost/kdapi/api/access_token", {"id":111,"secret":2352532}, function(result){

                alert(result.access_token)

            })

        }

    </script>

</head>

<body>

    <button onclick="getToken()" style="width: 120px height: 60px">获取Token</button>

</body>

</html>

需要准备的材料分别是:电脑、html编辑器、浏览器。

1、首先,打开html编辑器,新建html文件,例如:index.html,引入jquery使用。

2、在index.html的<script>标签中,输入js代码:

$.get('请求地址', function(b) {

document.body.innerText = b

})

3、浏览器运行index.html页面,此时通过F12的开发者工具可知API接口被调用了。