高德地图 Vue 中加载数据可视化 Loca 的方式

十月ooOO

已于 2022-07-07 08:58:47 修改

阅读量6.4k

点赞数 8

分类专栏： # Vue # JS 文章标签：可视化 vue 高德

于 2021-07-09 22:03:03 首次发布

本文链接：https://blog.csdn.net/KimBing/article/details/118615489

版权

JS 同时被 2 个专栏收录

129 篇文章

订阅专栏

Vue

68 篇文章

订阅专栏

本文讲述了开发者在尝试在Vue环境中使用Loca数据可视化时遇到的问题，重点在于版本设置错误导致的类找不到，以及如何通过AMapLoader正确加载和配置Loca。提供了解决步骤和相关文档链接。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

高德地图 Vue 中加载数据可视化 Loca 的方式

今天想用 Loca 试试如何的，结果怎么都加载不上，我的代码是这样的

AMapLoader.load({
            key: "这个就不展示了", // 开发应用的 ID
            version: "2.0",   // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
            plugins: [
                'AMap.ToolBar',
                'AMap.Scale', // 比例尺
                'AMap.Geolocation',
            ],
            Loca:{
                version: '2.0',
            }

        }).then(map => {
            AMap = map
            this.map = new AMap.Map('container', {
                viewMode: '3D',
                zoom: 18,
                center: MY_POSITION,
                mapStyle: 'amap://styles/45311ae996a8bea0da10ad5151f72979',
                showBuildingBlock: true,
                showLabel: false,
            });
            this.loca = new Loca.Container({
                map: this.map,
            });
        })