Openlayers 3导出地图到png图像大小

Question

我正在尝试将openlayers 3 map导出到PNG.

此示例运行良好http://openlayers.org/en/master/examples/export-map.html,但导出图像的宽度和高度是原始地图画布的两倍.

如果地图画布是1330x440,我将导出的png图像显示为2660x880像素.

知道如何让出口尺寸与帆布尺寸相同吗？

Answer 1

这是因为您的设备像素比为2,因为您有一个HiDPI(Retina)显示器.

您可以配置地图{pixelRatio: 1}并获取模糊地图,或者在ol.has.DEVICE_PIXEL_RATIO不相等时缩放导出的图像1:

map.once('postcompose', function(event) {
  var dataURL;
  var canvas = event.context.canvas;
  if (ol.has.DEVICE_PIXEL_RATIO == 1) {
    dataURL = canvas.toDataURL('image/png');
  } else {
    var targetCanvas = document.createElement('canvas');
    var size = map.getSize();
    targetCanvas.width = size[0];
    targetCanvas.height = size[1];
    targetCanvas.getContext('2d').drawImage(canvas,
        0, 0, canvas.width, canvas.height,
        0, 0, targetCanvas.width, targetCanvas.height);
    dataURL = targetCanvas.toDataURL('image/png');
  }
});
map.renderSync();