小程序 画布未加载

I was using the npm package to draw an image server-side using the Canvas API.

我正在使用 npm包通过Canvas API绘制服务器端图像。

Note: this is how to work with images in a canvas in Node.js, not in the browser. In the browser it’s different.

注意：这是在Node.js(而不是浏览器)中使用画布中的图像的方法。 在浏览器中是不同的。

Load the loadImage() function

加载loadImage()函数

const { createCanvas, loadImage } = require('canvas')

Create the canvas:

创建画布：

const width = 1200const height = 630const canvas = createCanvas(width, height)const context = canvas.getContext('2d')

Then call loadImage(), which returns a promise when the image is loaded:

然后调用loadImage() ，在加载图像时返回一个promise：

loadImage('./logo.png').then(image => {})

You can also use, inside an async function:

您还可以在异步函数中使用：

const image = await loadImage('./logo.png')

Once you have the image, call drawImage and pass it with the x, y, width and height parameters:

获得图像后，调用drawImage并将其与x，y，width和height参数一起传递：

context.drawImage(image, 340, 515, 70, 70)

翻译自:

小程序 画布未加载