vue项目vue-baidu-map无法加载

Question

才开始使用 vue-baidu-map 参考文档：https://www.cnblogs.com/chihObj/articles/11814162.html
没有任何报错但是地图无法加载 ak是已经换成自己的，loadBMap.js也进行了封装

如下图：

而且vue-baidu-map官网里面有些也无法加载
图：

有什么比较好的解决方法吗
如果不能使用vue-baidu-map的话应该用什么方法在vue项目里面加入地图，并且能进行路线检索等功能

Answer 1

幽暮的黄昏or明晨的白昼 下午好🌅🌅🌅
本答案参考ChatGPT-3.5

根据你提供的信息，你使用的是vue-baidu-map库，在引入地图时遇到了问题。以下是一些可能的解决方法：

1. 确认AK是否正确：你已经提到了，你需要确保AK的正确性。AK是百度地图API的密钥，确保密钥有效并替换到你的代码中。

2. 确保网络连接正常：在加载地图时，需要确保网络连接正常。如果你的网络连接存在问题，可能会导致地图无法加载。请检查你的网络连接，并按照官方文档正确引入百度地图API。

3. 检查loadBMap.js封装是否正确：你已经提到，你对loadBMap.js进行了封装。请确保封装后的代码正确，能够正常引入百度地图API并加载地图。

4. 检查加载地图的位置：请确认你的加载地图的位置是否正确。根据你提供的代码片段，你似乎将地图组件放在了模板的<el-content>标签内。请检查该标签是否正确使用，并确保地图组件能够正确插入。

如果你无法解决问题或者不想使用vue-baidu-map库，你也可以考虑以下方法在vue项目中加入地图，并进行路线检索等功能：

1. 使用百度地图JavaScript API：官方提供了基于JavaScript的地图API，你可以直接在vue项目中使用该API进行地图相关的操作。你可以参考官方文档，按照说明引入地图API，并使用提供的接口进行功能开发。

2. 使用其他地图库：除了百度地图之外，还有其他地图库可以选择，如高德地图、腾讯地图等。你可以选择符合你需求的地图库，并按照其文档说明在vue项目中引入并使用。这些地图库一般提供了路线检索、标记点、地理编码等功能，可以满足你的需求。

无论你选择哪种方法，都建议仔细阅读相应文档，并按照示例进行操作。如有问题，请提供相关代码以便更好地帮助你解决。