Openlayers 3層樣式問題

Question

我需要創建一個帶有氣象圖標的圖層-大約有100個。 所以。 我這樣定義它的來源：

    mappingAPI.meteoIconLayerSource = new ol.source.Vector({});

我將圖標添加為如下功能：

    for(stan in meteo.meteoData)
    {
        var iconFeature = new ol.Feature({
            geometry: new ol.geom.Point(ol.proj.transform([parseFloat(meteo.meteoData[stan].lon), parseFloat(meteo.meteoData[stan].lat)], 'EPSG:4326',   'EPSG:3857')),
            obj_id: meteo.meteoData[stan].obj_id,
        });

        mappingAPI.meteoIconLayerSource.addFeature(iconFeature);  
    }

有了源代碼后，就可以這樣創建圖層：

    mappingAPI.meteoIconLayer = new ol.layer.Vector({
        source: mappingAPI.meteoIconLayerSource,
        style: mappingAPI.getMeteoIconStyle            
    });

樣式定義如下：

return [new ol.style.Style({
  image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({
    anchor: [0.5, 0.5],
    anchorXUnits: 'fraction',
    anchorYUnits: 'fraction',
    opacity: 0.7,
    src: "data/meteo/icon" + feature.get('obj_id') + ".png"
})];

當如上所述定義src（使用指向唯一編號的要素屬性）時，地圖上的圖標開始閃爍，因為樣式過程一次又一次地不停地調用圖層上的所有要素。 如果出現這種情況，我將參考以下圖片替換定義：

src: "data/meteo/icon3898.png",

甚至像這樣：

src: "data/meteo/icon" + feature.get('dummy') + ".png",

對於所有要素而言，虛擬都是相同的，一切都很好-樣式過程將為每個要素調用一次，僅此而已，直到需要重繪地圖為止。

請，有人可以幫助解決這個問題嗎？ 還是還有其他方法，如何在不將src定義放入樣式的情況下將圖標放置在地圖上？

馬雷克

Answer 1

因此，看起來Openlayers在加載如此多的圖像時遇到問題，並且在未及時完成時會定期啟動重新加載（我只是在猜測）。 如果我將圖像預加載到網頁上的圖像對象中並且使用了img樣式屬性（而不是src），則可以按預期工作。 還必須設置imgSize屬性，否則根本不顯示圖標。 最好的方法是：

img: img,    
imgSize: [img.clientWidth,img.clientHeight]