Javascript OpenLayers渲染时间
我想根据属性在OpenLayers中设置一些点的样式,这里一切都很好,但是渲染时间非常慢,在我只对所有点使用一种样式之前,渲染速度非常快。在这两种情况下,我使用相同数量的点(约9000)。有什么可以改进的吗 我使用此函数为点提供样式:Javascript OpenLayers渲染时间,javascript,openlayers-6,Javascript,Openlayers 6,我想根据属性在OpenLayers中设置一些点的样式,这里一切都很好,但是渲染时间非常慢,在我只对所有点使用一种样式之前,渲染速度非常快。在这两种情况下,我使用相同数量的点(约9000)。有什么可以改进的吗 我使用此函数为点提供样式: var Styles = function (feature, resolution) { if (feature.get('Tipo') === 2) { strokecolor = [245,49,5,1]; }else{
var Styles = function (feature, resolution) {
if (feature.get('Tipo') === 2) {
strokecolor = [245,49,5,1];
}else{
strokecolor = [130,49,5,1];
}
return [new ol.style.Style({
image: new ol.style.Circle({
fill: new ol.style.Fill({
color: strokecolor
}),
radius: 3
})
})];
};
即使输入条件的一部分并仅为color
设置一个可能的值,速度也非常慢
在我给出这样做的风格之前:
var OneStyle = new ol.style.Circle({
fill: new ol.style.Fill({
color:[245,49,5,1]
}),
radius:3,
})
这就是我如何调用点和设置样式:
var events_points = new ol.layer.Vector({
source: new ol.source.Vector({
url:urlEvents,
format: new ol.format.GeoJSON()
}),
//style:Styles
style: new ol.style.Style({
image:OneStyle,
})
});
尽量避免每次调用函数时都创建新样式对象
var style1 = new ol.style.Circle({
fill: new ol.style.Fill({
color:[245,49,5,1]
}),
radius:3,
});
var style2 = new ol.style.Circle({
fill: new ol.style.Fill({
color:[130,49,5,1]
}),
radius:3,
});
var Styles = function (feature, resolution) {
if (feature.get('Tipo') === 2) {
return style1;
}else{
return style2;
}
};