视频融合平台EasyCVR电子地图轨迹跟踪异步加载百度地图SDK的操作方法

在往期的文章中我们分享过关于EasyCVR电子地图轨迹跟踪的功能开发，感兴趣的用户可以查看这篇文章：智能视频融合EasyCVR平台GIS电子地图：如何实现GPS坐标转换？

电子地图的功能当前接入的是百度地图key，功能发布后，用户将根据自身的需求配置自己的百度地图key。但是前端无法保存key，因此需要从服务端获取后进行加载。今天分享一下加载操作。

1）默认的方式是同步加载key，但是同步加载则无法插入服务端配置的key，因此需要去除。

 

 

2）在utilsjs方法集加入如下函数：

 

 

参考代码如下：

export function LoadBaiduMapScript(AK) {
    //console.log("初始化百度地图脚本...");
    const BMap_URL = "//api.map.baidu.com/api?v=2.0&ak="+AK+"&s=1&callback=onBMapCallback";
    return new Promise((resolve, reject) => {
        // 如果已加载直接返回
        if(typeof BMap !== "undefined") {
            resolve(BMap);
            return true;
        }
        // 百度地图异步加载回调处理
        window.onBMapCallback = function () {
            console.log("地图脚本初始化成功...");
            resolve(BMap);
        };
        // 插入script脚本
        let scriptNode = document.createElement("script");
        scriptNode.setAttribute("type", "text/javascript");
        scriptNode.setAttribute("src", BMap_URL);
        document.body.appendChild(scriptNode);
        scriptNode.onerror = function (e) {
            console.log("地图脚本初始化失败 error:",e);
            resolve()
        }
    });
}

3）在项目中，路由监听加入LoadBaiduMapScript函数：

 

 

EasyCVR视频平台可拓展性强、部署轻松、操作便捷，线下场景中的项目应用也十分广泛。为了满足用户的集成与二次开发需求，我们也提供了丰富的API接口供用户调用。有需要的用户可参照官方接口文档进行操作。若有技术上的疑问，也可以联系我们进行协助。