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();

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

1 个答案: