使用预合成剪辑图层时 Openlayers 旋转中断

Question

将 Openlayers 更新到 >4.0 后，使用 precompose 挂钩时地图旋转完全中断：

function precompose(event) {
    var context = event.context;

    context.beginPath();
    context.moveTo(0, 0);
    context.lineTo(100, 0);
    context.lineTo(100, 100);
    context.lineTo(0, 100);
    context.lineTo(0, 0);
    context.closePath();

    context.fillStyle = "rgba(0, 5, 25, 0.75)";
    context.fill();
}

Answer 1

保存 canvas 上下文很重要，有关详细信息，请参阅 MDN CanvasRenderingContext2d

function precompose(event) {
    var context = event.context;
    context.save(); // be sure to save the context before anything is done
    // ...
}

此外，在 postcompose 挂钩中使用 context.restore()。

使用预合成剪辑图层时 Openlayers 旋转中断

Openlayers rotation broken when using precompose to clip a layer

openlayers-3