Questions tagged [node-canvas]

Node canvas is a Cairo backed Canvas implementation for NodeJS.

Installation

$ npm install canvas

node-canvas extends the canvas API to provide interfacing with node, for example streaming PNG data, converting to a Buffer instance, etc. Among the interfacing API, in some cases the drawing API has been extended for SSJS image manipulation / creation usage, however keep in mind these additions may fail to render properly within browsers.

Github

Node Wiki

152 questions
2
votes
1 answer

Node-Canvas on Vercel Serverless Function - Serverless Function exceeds the maximum size of 50mb

In my Next.js project, I am using fabric and fabricjs-react as a wrapper over fabric to allow users to drop images into my canvas. Now one of fabric's dependency happens to be node_modules/canvas/build which has a compressed size of 42.82 MB. I…
Sounav Saha
  • 75
  • 1
  • 7
2
votes
0 answers

Node.js readable maximize throughput/performance for compute intense readable - Writable doesn't pull data fast enough

General setup I developed an application using AWS Lambda node.js 14. I use a custom Readable implementation FrameCreationStream that uses node-canvas to draw images, svgs and more on a canvas. This result is then extracted as a raw image buffer in…
flohall
  • 967
  • 10
  • 19
2
votes
0 answers

FabricJS generating PNG in nodeJS, but sometimes images show as black rectangles. Cause and options to fix/handle?

We generate PNGs from the canvas in nodeJS, but usually when there are many images, sometimes some of the images just display as black rectangles. We assume those images timeout and so the black rectangles are there. What is the cause? What are the…
2
votes
4 answers

Cannot install canvas on npm

I am trying to install canvas on my raspberry pi via npm after successfully installing on my main pc, but now I get a really long error that I don't know how to fix. Here's the full error: npm ERR! gyp info spawn args ] npm ERR! Package pixman-1 was…
user12781352
2
votes
1 answer

Cannot npm install canvas [NodeJs on Windows]?

I am trying to use the ag-psd packgage for manipulating psd files. It works fine for the structure only but it encounters an error if you want to read the image data too. The error reads: Cannot find module 'canvas', ..., code:…
Janez Kranjski
  • 115
  • 2
  • 10
2
votes
0 answers

node canvas not installing on docker

can anyone help me to figure out this error? so I'm doing node version upgrade and dockerization tasks. we used node js 8.15.1 before now we want to update it to node js 16.15.0 the project was working on node 8.15.1 but when I tried to run npm…
2
votes
2 answers

how can I use node-canvas in electronjs-17 on windows?

I've installed all essentials for my windows to build application with electronjs. versions: node -v v17.5.0 npm -v 8.4.1 > My dependencies "dependencies": { "electron-squirrel-startup": "^1.0.0", "extract-zip": "^2.0.1", "nan":…
2
votes
0 answers

No such file or directory when loading image using node-canvas

Above is the code I'm attempting to run, for some reason the 'no such file or directory' error is thrown but i know for a fact the image is there. I can't see anything wrong with the current code. async generateWishBackground(ctx) { const…
Alsware
  • 36
  • 1
2
votes
2 answers

How to replace color with image in NodeJS

As I mentioned in the title, how do I replace a color with a image in NodeJS? Like a green screen
Vexop
  • 21
  • 2
2
votes
1 answer

FabricJS not render SVG correct when SVG include text with custom font?

I have a problem with render SVG in fabricjs when SVG include text with custom font. How to make SVG in Fabricjs display correct with custom font? Here is my code: var canvasObject = document.getElementById("editorCanvas"); // set canvas…
Tho Bui Ngoc
  • 763
  • 1
  • 11
  • 36
2
votes
1 answer

Overlapping clipping issue

I have an issue where I am grabbing a users displayAvatar() and then I use an arc to make the image round. This works fine, however, I need to place a circle on top of that image, but it is getting cut in half because of the previous clip() Without…
Ragnar Lothbrok
  • 306
  • 1
  • 4
  • 22
2
votes
1 answer

How to fix cairo error in node.js app: Assertion failed: (angle_max >= angle_min)

ERROR I GET: Assertion failed: (angle_max >= angle_min), function _cairo_arc_in_direction, file cairo-arc.c, line 189. With some svg icons my code works fine, but some of them cause issue (error above) const svgContent =…
2
votes
1 answer

How to use image-slice in node js?

I tried using image-slice to slice into multiple part using node js. I tried installing npm i image-to-slices, sudo port install cairo, npm i canvas and brew install pkg-config cairo pango libpng jpeg giflib but still show error require node-canvas…
PvDev
  • 791
  • 21
  • 67
2
votes
0 answers

Save node canvas image to firebase server

I'm trying to create and image on the Google Firebase server with node-canvas and store it in Firebase Storage. const functions = require('firebase-functions'); const admin = require('firebase-admin'); const gcs =…
Phil
  • 63
  • 1
  • 5
2
votes
1 answer

Rendering three.js server-side using node-canvas?

I've been trying to render images using the official three.js package, three on npm by using the canvas package on npm. So far, not much luck. I believe this should be possible as node-canvas (https://github.com/Automattic/node-canvas) is a full…
Mia
  • 6,220
  • 12
  • 47
  • 81
1 2
3
10 11