在node.js/Express中绘制canvas上的图形

Question

我想在 canvas 元素上绘制图表。 我的玉文件包含以下内容：

div
   canvas

在 node.js web 应用程序中的 index.js 文件中，我尝试了以下操作：

var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
context.beginPath();
context.strokeStyle = "rgba(255, 0, 0, 1)";
height = canvas.height;
width = canvas.width;
context.moveTo(0, 0);
context.lineTo(width, height);
context.lineWidth = 1;
context.stroke();

但是，它无法识别“文档”。 我的问题是如何在 my.js 文件中获取对“canvas”的引用？ 请注意，为简洁起见，实际图表会比上面显示的简单线条图代码更复杂。 图表的数据在服务器端的 index.js 文件中生成。 因此图表将在服务器上创建。

Answer 1

NodeJS无法获得对用户浏览器的引用以在显示的页面上进行绘制。 尽管它是Javascript，但NodeJS在服务器端执行。 您的HTML页面中必须编写相同的代码。

如果您的绘图需要来自后端NodeJS逻辑的某些数据，则Javascript页面将必须调用您的NodeJS服务以获取相关数据。

Answer 2

截至2021年8月，可以使用https在Node.js中绘制Canvas://github.com/Automattic/node-canvas