在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