高德地图使用插件报错AMap.Xxx is not constructor

最新推荐文章于 2023-09-19 11:27:22 发布

sun_wei_tao

最新推荐文章于 2023-09-19 11:27:22 发布

阅读量1.3w

点赞数 2

分类专栏：高德地图AMap 文章标签：前端

本文链接：https://blog.csdn.net/qq_43447509/article/details/115108767

版权

本文介绍了如何解决在使用高德地图时遇到的'AMap.Xxx is not constructor'错误。提供两种解决方案：1. 同步加载插件，通过在地图的script标签中拼接多个插件；2. 异步加载插件，利用AMap.plugin方法，并用数组方式传入多个插件名。

摘要由CSDN通过智能技术生成

报错的原因是在代码中使用了地图插件例如ToolBar、OverView、Scale，但是并没有加载插件

解决方案

同步加载插件：在引入地图的script标签进行如下拼接，多个插件用逗号分隔

<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=您申请的key值&plugin=AMap.ToolBar,AMap.Driving"></script>

异步加载插件：通过AMap.plugin方法引入，使用数组接收多个插件参数

AMap.plugin

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

sun_wei_tao

关注关注

2
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

vue使用高德地图 -- AMap.Autocomplete is not a constructor报错问题

weixin_44801790的博客

08-15

8365

vue使用高德地图 -- AMap.Autocomplete is not a constructor报错问题

高德地图API报错：ESLint: ‘AMap‘ is not defined.(no-undef)

热门推荐

shidaping的博客

11-15

7万+

这个问题说的是AMap.Map不是一个构造函数。原因就有于有一部分代码没有执行完毕。这是因为amap js里面有一部分是异步加载的，或者是我们在js中手动加载amap js导致的。amap js提供了一个callback回调，把创建地图的代码放在回调里即可。需要先创建一个全局函数，具体代码如下： window.init = function(){ var map =

AMap.xxx is not constructor高德地图

weixin_43738272的博客

03-10

4037

AMap.xxx is not constructor 出现这个问题是map的插件还没有加载完。解决办法: 在public文件夹下的index.html直接引入地图的sdk 注意点: 将使用到的插件&拼接到后面，如图中红框。 ...

❤ 使用框架篇

林太白

03-23

1489

❤使用框架篇

高德地图AMap.Map is not a constructor

u010507417的博客

05-03

1万+

高德地图的js中有部分代码是异步执行的，就导致可能js还没有加载完，自己的代码就执行了，这种情况下，要保证地图的js加载顺序在最前面，并且支持返回callback的方式，这种方法是最靠谱，已经测试过好几种情况<script src="http://webapi.amap.com/maps?v=1.4.0&key=您申请的key值&callback=init"></...

vue-amap TypeError: v.w.uh is not a constructor究极方案

qrn121314的博客

07-15

679

vue-amap TypeError: v.w.uh is not a constructor 公司的后台系统需要对用户进行接单位置标点。我就想到了vue-amap，经过不断尝试终于把这玩意的坑走了一遍，上干货。 1：如何进行大量数据渲染，我们都知道浏览器一瞬间加载大量数据是会卡死的，这样对用户非常不友好，后来发现网上有很好的方案：分批加载。先把数据按拆分，利用setInterval分批加载数据，不一次性呈现数据，这样浏览器会依次加载数据，不至于卡死。 2：TypeError: v.w.uh is not

高德地图点聚合，点聚合点击事件，单点点击事件

06-06

高德地图点聚合，聚合点点击事件，一切效果都需要您自己的key值，单点点击事件，点聚合点击事件后信息窗体每个点添加点击事件。

AMap.Geocoder高德地图逆向地理编码（JS代码+对应数据展示前段代码）

04-09

楼主实战，根据自身需求加在对应位置即可——...不包含开发者Key，地图标点等其他高德地图API提供接口技术功能，只适用加进自身开发中项目，添加逆向地理编码功能。个别地方加了注释，不懂自行搜索或遇到问题联系楼主。

Error in mounted hook: "TypeError: AMap.MouseTool is not a constructor"

郭宝的博客

10-16

6530

错误提示：解决办法：如果是直接引入的高德地图js文件，那么只需在路径后面添加&plugin=AMap.MouseTool 即可，全部路径如下： <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=你申请的KEY=AMap.MouseTo...

Cesium 报错：TypeError: Cesium.MeasurementTool is not a constructor

虎康的博客

09-19

1008

如果您的 Cesium 版本是符合要求的，但仍然遇到相同的错误，请检查您是否正确引入了 Cesium 库。如果在创建测量部件时遇到了"TypeError: Cesium.MeasurementTool is not a constructor"错误，那很可能是因为您使用的是不支持测量工具的 Cesium 版本。测量工具是从 Cesium 1.82 版本开始引入的，所以确保您使用的是 Cesium 1.82 及以上的版本才能使用测量工具。请确保替换的路径正确指向您存储的 Cesium 库文件。

TypeError: AMap.Autocomplete is not a constructor

qq_44832960的博客

10-25

4879

使用vue-amap搜索控件时候出现的问题，我这边是发现项目在main.js里面引入之后，在index.html里面也有而且少了下面的控件所以才会出现的报错

高德地图报错TypeError: undefined is not a constructor

橙子yq的代码世界

11-04

4048

高德地图在开发聚合和路线规划时报错TypeError: undefined is not a constructor(evaluating 'new n.Driving(map:pe)) found in ... 经排查, 原因是没有引入对应的插件, 我们来看看官方文档 <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=密钥&plugin=AMap.Marke..

vue-amap 初始化报错 AMap.PolyEditor is not a constructor 和 a[d].split is not a function

lyn1772671980的博客

03-29

3535

main.js中 import VueAMap from 'vue-amap' Vue.use(VueAMap) VueAMap.initAMapApiLoader({ key: '6cf4109dca43906adfe00d4bbb6d93b5', // 康药麦麦高德key plugin: [ 'AMap.Autocomplete', 'AMap.PlaceSearch', 'AMap.Scale', 'AMap.OverView', 'AMap.Too

vue问题记录（十四）：vue-amap 报错TypeError: v.w.uh is not a constructor

Fiona_lms的博客

07-18

4634

这几天在做一个新项目，。然后里面涉及到地图定位以及地图展示的问题，百度了一下，因为我的项目是vue-cli的，然后可以直接用vue-map这个, 首先第一步是安装依赖： npm install vue-amap --save 第二步就是根据官方文档进行引入了，地址vue-map, 然后我按照这个文档，进行操作，最终运行的时候，页面报错了 v.w.uh is not a constructor ...

报错AMap.Driving is not a constructor

06-01

如果您在使用高德地图JavaScript API时遇到了“AMap.Driving is not a constructor”错误，这可能是因为您未正确引入Driving插件或引入方式不正确。您需要在HTML页面中正确引入AMap API和Driving插件，例如： ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>地图示例</title> <script src="https://webapi.amap.com/maps?v=1.4.15&key=您的key值"></script> <script src="https://webapi.amap.com/ui/1.0/main.js"></script> <link rel="stylesheet" href="https://cache.amap.com/lbs/static/AMapUI-1.0-1.10.1.css"/> <script src="https://cache.amap.com/lbs/static/addToolbar.js"></script> </head> <body> <div id="mapContainer" style="height: 500px;"></div> <script> // 创建地图 var map = new AMap.Map('mapContainer', { center: [116.397428, 39.90923], zoom: 13 }); // 创建Driving对象 var driving = new AMap.Driving({ map: map, panel: 'panel' }); </script> </body> </html> ``` 上面的代码演示了如何正确引入高德地图API和Driving插件，然后创建Driving对象。如果您仍然遇到问题，请检查您的代码和API文档，以确保您正确地使用了Driving插件。