vue框架下echarts導入地圖和調用百度地圖接口

vue框架下echarts導入地圖和調用百度地圖接口的一些幫助和介紹

概述：主要是在vue框架下導入地圖（全國地圖和百度地圖），因為自己在團隊項目中負責的就是前端的地圖功能頁面，同時盡量按照原型設計的完成。

一. 在vue框架下導入中國地圖及下鑽到各省市地圖

• 第一步需要下載echarts插件，需要命令窗口cd到項目根目錄下，執行cnpm install echarts --save-dev的命令。

• 第二步在在main.js中全局引入
  

• 第三步創建echares組件：具體代碼參考鏈接
  https://www.cnblogs.com/ldlx-mars/p/9242250.html

• 第四步實現地圖下鑽到具體省市。
  需要進行具體的配置，代碼和配置參考鏈接
  https://www.cnblogs.com/ryanchong/p/13031866.html

二. 在vue框架下調用百度地圖api

• 步驟一：申請百度地圖密鑰；
  申請過程比較簡單，有一個具體的教程鏈接：
  https://jingyan.baidu.com/article/e73e26c0b5b75124adb6a786.html

• 步驟二：在index.html中添加百度地圖JavaScript API接口；

在密鑰位置填入你申請的密鑰

• 步驟三：在webpack.base.conf.js配置文件中配置BMap
  

• 步驟四：在地圖組件中import BMap
  

• 步驟五：創建地圖對象，在mounted生命周期調用；
  具體代碼參考鏈接
  https://www.jb51.net/article/160224.htm

這樣就完成了在vue框架下的百度地圖api的調用，然后使用vue中的路由跳轉和動態傳參就可以實現具體的中國地圖跳轉百度地圖了。

一些有用的參考鏈接：

百度地圖開發平台:http://lbsyun.baidu.com/

Vue官網:https://cn.vuejs.org/

Echarts官網:https://echarts.apache.org/zh/index.html