前端系列——vue2+高德地图web端开发(使用和引入)

vue2+高德地图web端开发(使用和引入)
前言
准备工作
高德地图的个人开发者注册
高德api网址
1.点击进行注册
2.注册完之后进入控制台
3.创建新应用
4.添加
高德 2.0 新增
创建vue2的项目
npm 引入高德
官方文档
1.安装
2.进入项目
3. NPM 方式安装使用 Loader
4.在component目录下新建MapContainer.vue
5.编写基础页面结构
6. 在< script >中引入AMapLoader
6.1 import
6.2 引入安全密钥
完整代码
7.构建地图
7.1data数据声明
7.2methods中构建初始化地图方法
7.3mouted生命周期中调用方法对页面进行渲染
完整代码
vue使用

结果展示
第一步:

创建vue2的项目

1 vue create xxx

2 cd xxx

3 npm run serve

第二步引入高德

官方文档

你可能感兴趣的:(vue.js,javascript,前端)