首页 > 解决方案 > Heremaps交互式javascript API:maptile加载事件

问题描述

我在一个角度应用程序中实现了heremaps并使用它使用wkhtmltopdf打印PDF,问题是我需要有一个可靠的事件来收听,以便通知wkhtmltopdf我的地图已完全加载并准备好打印。具体来说,打印 PDF 时,某些图块要么未加载,要么仍处于模糊状态。

我试图收听该mapviewchangeend事件,但在加载瓷砖时不会抛出它。我也尝试过监听render渲染引擎的事件,但是每次加载一个图块时都会抛出一个事件,我不知道我应该等待多少个图块

// add a listener on the map ready event
this.map.getEngine().addEventListener("render", (event: H.util.Event) => {
    if (this.map.getEngine() === event.target) {
        map.mapReadyAction();
    }
});

是否有可靠的方法可以知道我的地图图块何时已完全加载并准备好打印?

编辑:使用评论中链接的帖子,我找到了一种可靠计算加载图块数量的方法。不幸的是,我找不到一种方法来确定我的地图需要加载的瓷砖总数(getTileNumber()在代码中)

this.nbLoadedTiles = 0;
this.map
    .getBaseLayer()
    .getProvider()
    .addEventListener("update", () => {
        this.nbLoadedTiles++;
        console.log(`tile loaded : ${this.nbLoadedTiles}`);

        if (this.nbLoadedTiles === this.getTileNumber()) {
            console.log("All tiles loaded");
            map.mapReadyAction();
            this.nbLoadedTiles = 0;
        }
    });

谢谢 !

标签: javascripthere-api

解决方案


不是一个可接受的答案,但它是我在等待适当解决方案时使用的解决方法:

我正在使用原始帖子中描述的“瓦片加载”事件来启动计时器,如果在这段时间内没有加载其他瓦片,我认为地图已加载。

// add a listener on the map ready event
this.map
    .getBaseLayer()
    .getProvider()
    .addEventListener("update", () => {
        // a new tile was succesfully loaded: reset the timer
        clearTimeout(this.tileTimer);
        this.tileTimer = setTimeout(() => {
            map.mapReadyAction();
        }, DELAY_TILE_LOADED);
    });

我以 3 秒的延迟运行此程序,以便在最大机会拥有完全加载的地图和可接受的延迟之间做出可接受的折衷。请注意,我的用户不是客户,因此等待 3 秒是可以的,但对于在线应用程序来说,这可能是不行的


推荐阅读