Atlaslog / Field Notes / OpenLayers layers
Field note · OpenLayers layers
Vector layer flashes white on every pan frame
Quick answer
updateWhileInteracting: true redraws the whole layer each frame, and the canvas renderer clears before re-drawing 8000 features, so the layer disappears for about 100 ms per pan. The default false avoids the flash but leaves the layer lagging behind the basemap.
Symptom
- While dragging, the whole vector layer vanishes for roughly 100 ms and reappears on release.
- The performance panel shows VectorLayer.renderFrame taking more than 30 ms per frame.
- The flash duration grows as feature density increases.
Checklist
- Set updateWhileInteracting to false and confirm the flash disappears.
- Time the style function across all features to measure per-frame cost.
- Check whether declutter is on, since it re-lays out every label each frame.
- Count source.getFeatures().length.
Fix
Keep interaction redraw only for the dynamic layer, share one style object, set declutter: false and updateWhileAnimating: false, or move the dense point layer to ol.layer.WebGLPoints.
Code
console.log('要素数', source.getFeatures().length);
var t0 = performance.now();
source.getFeatures().forEach(function (f) { layer.getStyleFunction()(f, 1); });
console.log('样式耗时 ms', performance.now() - t0);var layer = new ol.layer.Vector({
source: source,
style: sharedStyle,
updateWhileInteracting: true,
updateWhileAnimating: false,
declutter: false
});
Watch out
- Turning off updateWhileInteracting on a layer that must track the cursor makes features visibly trail the basemap.
- Filtering the source to reduce the feature count changes the data rather than the render cost.
English edition written for Atlaslog from the original Chinese field note. Code is unchanged and runs as-is.
Atlaslog (2026). Vector layer flashes white on every pan frame. https://www.jingweizhi.com/en/cookbook/ol-feature-flicker.html (accessed 2026-11-03).