canvas - Node -o3-canvas 与 Node -canvas？

Question

有人有使用这两个 Node.js 库中的一个或两个的经验吗？很想知道每个人的成功或困难。

Answer 1

LearnBoost是社区中最多产的 Node 模块开发人员之一，因此我选择使用 node-canvas 而不是 node-o3-canvas。

我使用 Node Canvas 将图像切成服务器上的图 block 并将它们发送回客户端。一切都按照您的预期进行。以下是您可能编写的代码示例:

helper = function(x, y, canvas) {
    return function(err, str) {
        if (!tiles[x]) {
            tiles[x] = [];
        }

        tiles[x][y] = { 
            data: str
            , buffer: canvas.toBuffer()
            , covered: true 
        };
    };
};  

for (y = 0; y < tilesPerColumn; y += 1) {
    for (x = 0; x < tilesPerRow; x += 1) {
        //Create a new tile canvas each time so they don't run over each other
        tCanvas = new Canvas(chunkSize, chunkSize);
        tCtx = tCanvas.getContext('2d');

        xOffSet = chunkSize * x;
        yOffSet = chunkSize * y;

        //Save a set of uncovered tiles to store in memory
        tCtx.drawImage(img, xOffSet, yOffSet, chunkSize, chunkSize, 0, 0, chunkSize, chunkSize);
        tCanvas.toDataURL(helper(x, y, tCanvas));        
    }
}

我遇到的唯一问题是:

• 如果您在 Node Canvas 中使用异步方法，则需要小心分配新的 Canvas /上下文实例，以免中断可能正在写入/绘图的实例。
• 出于某种原因，在使用服务器端 Base64 编码图像时，我始终无法让 node-canvas 的 Image() 对象正常工作。我的问题是，当 src 属性被分配一个 base64 字符串时，onLoad 事件不会触发。我没有花太多时间解决这个问题，而是将图像写入临时文件来解决该问题。