0%

ol 优化

Posted on

思路：小于的 segment 合并 画 1 个？（填补 segments 之间的 缝隙）

导致新问题： 何时重画 为 小段？

styleFunc 里面不能修改 feature 本身数据！需要 map on change:resolutuon 和 map on moveend (如果 point 视野外 被删除的话)

必须 styleFunction 里面 否则 zoom drag 永远不显示啦！！！！

styleFunction 里面和外面（不进入geojson） return 的区别：全局变量有。但是不画，也点不到。

  • multiline 多根 -> 1根 缺点是： 不能识别 segment

  • 同理 multi point

  • 短于 10 像素的 line 不画

  • point 数量 > 2000 不画

  • point 位置重叠 不画

短于 10 像素的 line 不画

1
2
3
let res = map.getView().getResolution();
let dt = get_distance_by_co2([sposx, sposy],[eposx,eposy],1) / res;
if(dt<20){return;}

getClosestFeatureToCoordinate

注意：这个性能也很差！

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
// 伟业开  pos_x: 108.939079   pos_y: 34.254787

var cor = [108.939079,34.254787];
var pos = ol.proj.transform(cor,'EPSG:4326', 'EPSG:3857');
var rs = layer_bdz.getSource().getClosestFeatureToCoordinate(pos,function(d){
//  console.log(d);
  let prop = d.getProperties();
  return prop['pos_x']!= cor[0] && prop['pos_y']!= cor[1];
})
console.log(rs);

// 最近的 多少 米
var pp2 = rs.getProperties();
var pos2 =  ol.proj.transform([pp2.pos_x,pp2.pos_y],'EPSG:4326', 'EPSG:3857');
var dd = get_distance_by_co2(pos,pos2,0);  // 1 是经纬度;0 是 google 坐标
console.log(dd);

// 最近的 多少 像素
var dxy = dd/map.getView().getResolution();
console.log('最近的 feature 距离 像素：',dxy);
if(dxy < 20){return;}

map.hasFeatureAtPixel(pixel)

1
2
3
4
5
6
7
8
var pos = ol.proj.transform([108,34],'EPSG:4326', 'EPSG:3857'); //
var pixel = map.getPixelFromCoordinate(pos); // lnglat -> xy
console.log(pixel);
var is_repeated = map.hasFeatureAtPixel(pixel,{
  hitTolerance:20
});  // xy has feature
console.log(is_repeated);
if(is_repeated){return;}

注意：但是 map.hasFeatureAtPixel 性能很差！！！！！！执行时间很长！

stylefunc_node_default

styleFunction_segment