首页 / OpenLayers / 使用示例
矢量图层裁剪
用画布路径保住一块区域,其余部分在绘制时被裁掉。
源码与运行效果
说明
图层级裁剪靠绘制上下文:在 prerender 里按多边形像素路径 clip(),在 postrender 里 restore()。
官方示例用同一手法把矢量层裁成自定义形状。示例里虚线多边形是裁剪边界,蓝点与红线是原始内容,取消勾选即可看到被裁掉的部分。
要点
- 像素路径由
map.getPixelFromCoordinate得到,必须closePath()。 save与restore要成对,否则后续图层也会被裁。- 裁剪只影响绘制,要素数据完整保留。
边界随视图变化,裁剪路径要在每次 prerender 重新计算,不能缓存。