js接入高德地图API（简单快速上手）

原创

已于 2022-02-17 14:37:48 修改 · 5.8k 阅读

标签

#javascript #前端 #api

收录于

于 2022-02-17 11:18:09 首次发布

本文介绍了如何快速使用JavaScript接入高德地图API，包括注册获取API key和实现两地驾车路线规划的代码示例，帮助前端开发者轻松上手。

功能实现效果：

位置导航

两地直接驾车路线规划

学习内容：

1、快速实现高德地图导航路线规划

1.注册高德地图API：

官方网站https://lbs.amap.com/

注册账号并登录
点击右上角控制台进入控制台
点击应用管理–>我的应用–>创建新应用
输入应用名称和应用类型点击新建
这时候看到应用创建成功
现在我们点击添加按钮来添加我们的key，输入名称，服务平台（选择web端（JS API）），IP白名单(可选)点击提交
申请成功进入首页点击管理key就可以看见所申请的key

2.代码编写：

拿到key后就可以进行代码的编写
Demo(地点关键字 + 驾车路线规划)

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <title>地点关键字 + 驾车路线规划