如何将其他图标应用于克隆的功能

问题描述

我已经实现了绘制图标而不是常规形状的功能，如下图所示：

我的意图是在此功能（以及许多其他功能）旁边添加一个图标警报。因此，要尝试实现此目的，我将克隆功能并尝试以创建的样式应用其他图像，例如以下代码：

export const setIconEffect = (feature: Feature,event: any) => {
    const vectorContext = getVectorContext(event);

    // clone the feature geometry
    const flashGeom = feature.getGeometry().clone();

    // creates a new style to be applied into this cloned feature
    const style = new Style({
        image: new Icon({
            src: 'assets/images/mapElements/warning-icon.png',scale: 0.1,imgSize: toSize(500),anchorOrigin: Iconorigin.BottOM_RIGHT,anchor: [1.8,0.05],}),});
    // set it into the cloned geometry
    vectorContext.setStyle(style);
    vectorContext.drawGeometry(flashGeom);
};

问题在于，当我尝试应用其他src时，它不起作用，但是，如果我使用相同的src，则它起作用了。

应用其他src只会照常显示标记。 应用相同的src可以正确绘制图标，但是可以复制（但这不是目的）。下面的示例：

解决方法

定义样式后，我们需要执行以下操作来强制加载图像：

style.getImage().load();