Threejs / WebGL导出画布作为大小的图像

Question

我有一个用户可以绘制的画布，我试图将画布作为图像导出（或读取原始数据）。

我的画布处于纵向模式（300x500），底层原始图像为400x400。当我使用canvas.toDataURL或context.getPixel时，我的结果总是300x150，因为这似乎是webgl中drawingbuffer大小的默认值。我试图改变这些价值观，但无济于事。

我正在使用three.js WebGLRenderer。

有什么方法可以按正确的尺寸和尺寸导出画布/图纸吗？

这是我的代码的一小部分来说明问题：

CSS：

use

JS：

.canvas
{
    width: 300px;
    height: 500px;
    background-color: #352a87;
}

问题是conext.drawingBufferWidth是300而context.drawingBufferHeight是150而不是我需要的400x400。

我知道我从未将它设置为400x400，但我不知道最佳位置是如何/在哪里。