When loading many feature footprint vectors onto the map, the openlayers map and web application becomes unresponsive. Is there any way to improve the performance of the openlayers map with many vectors?
We would like to be able to support at least 1000 vectors on the map at once.
We are using openlayers 4.
As I can tell, OpenLayers 3+ uses HTML5 canvas to render images and vectors. I've seen the canvas being used to make video games and other high performance graphic applications. I don't understand why it would cause this unresponsive issue with OpenLayers though.
Edit: When I say "vectors" I mean square polygons. This application will run on a desktop with average computing power.
TL/DR: Yes.
If not, it's likely your own fault. But there are a few easy fixes for when an OL application becomes slow/unresponsive.
- Use the image render mode(previously known as ImageVector) for large vector layers.
ol.layer.Vector({ renderMode: 'image', ... })
Great performance, but point symbols and texts are always rotated with the view and pixels are scaled during zoom animations.
When you have many features, do not create new styles for each of them with a styleFunction. Instantiating objects is expensive in JavaScript. Try to switch to static styles.
If you are only displaying points, use an cluster layer . Showing one quadrupillion points isn't very helpful anyway
Try the webgl renderer. It is probably faster, but might also look a bit different
.
if (ol.has.WEBGL) {
var map2 = new ol.Map({
renderer: (['webgl', 'canvas']),
....
});
} else {
// fallback
}
来源：https://stackoverflow.com/questions/48573480/is-displaying-1000-feature-footprint-vectors-on-openlayers-map-with-good-perfor