openlayers-3 precompose，如何使用矩形几何图形进行图层裁剪

Question

我正在尝试制作一个简单的应用程序来执行类似于 Layer Spy Example 的操作，但我想根据始终居中的矩形进行裁剪，而不是鼠标指针流动的圆圈在地图上。（最好使用 "fixed" 大小”，即缩放时更改 "extent"）

感谢任何帮助谢谢弗罗德

Answer 1

您可以按照您所指的示例进行操作。但是不要使用 context.arc() 而是使用具有固定位置的 context.rect() 来裁剪图层。类似于：

imagery.on('precompose', function(event) {
  var ctx = event.context;
  var pixelRatio = event.frameState.pixelRatio;
  ctx.save();
  ctx.beginPath();
  var x = ctx.canvas.width / 2 - 100;
  var y = ctx.canvas.height / 2 - 100;
  ctx.rect(x, y, 100, 100);
  ctx.clip();
});

http://jsfiddle.net/eo1c1x78/

openlayers-3 precompose，如何使用矩形几何图形进行图层裁剪

openlayers-3 precompose, how to do layer clipping with a rectangular geometry

openlayers-3