Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

CanvasGradient is not defined

See original GitHub issue

I’m using chartjs-node to create a chart and send it in a nodejs Discord bot.

const chartNode = new ChartjsNode(300, 300);
chartNode.drawChart({
	type: 'line',
	data: {
		datasets: [{
			label: 'Ping',
			data: message.client.pings
		}]
	},
	options: {}
})
.then(() => {
	return chartNode.getImageBuffer('image/png');
}).then(stream => {
	message.channel.send({ files: [{ attachment: stream }] }).then(() => {
		chartNode.destroy();
	});
});

message.client.pings is an array of 3 numbers. The graph works fine with 1 and 2 numbers but once it gets 3 it errors with Unhandled rejection ReferenceError: CanvasGradient is not defined

Here is the whole error

1|martin   | Unhandled rejection ReferenceError: CanvasGradient is not defined
1|martin   |     at helpers.color (/home/kye/apps/martin-discord-bot/node_modules/chart.js/src/core/core.helpers.js:927:25)
1|martin   |     at ChartElement.draw (/home/kye/apps/martin-discord-bot/node_modules/chart.js/src/elements/element.point.js:93:23)
1|martin   |     at ChartElement.draw (/home/kye/apps/martin-discord-bot/node_modules/chart.js/src/controllers/controller.line.js:298:15)
1|martin   |     at Chart.drawDataset (/home/kye/apps/martin-discord-bot/node_modules/chart.js/src/core/core.controller.js:573:20)
1|martin   |     at Chart.drawDatasets (/home/kye/apps/martin-discord-bot/node_modules/chart.js/src/core/core.controller.js:548:9)
1|martin   |     at Chart.draw (/home/kye/apps/martin-discord-bot/node_modules/chart.js/src/core/core.controller.js:510:7)
1|martin   |     at Chart.render (/home/kye/apps/martin-discord-bot/node_modules/chart.js/src/core/core.controller.js:477:8)
1|martin   |     at Chart.update (/home/kye/apps/martin-discord-bot/node_modules/chart.js/src/core/core.controller.js:375:8)
1|martin   |     at Chart.construct (/home/kye/apps/martin-discord-bot/node_modules/chart.js/src/core/core.controller.js:121:7)
1|martin   |     at new Chart (/home/kye/apps/martin-discord-bot/node_modules/chart.js/src/core/core.js:7:8)
1|martin   |     at jsdom.envAsync.then.window (/home/kye/apps/martin-discord-bot/node_modules/chartjs-node/index.js:80:31)
1|martin   |     at tryCatcher (/home/kye/apps/martin-discord-bot/node_modules/bluebird/js/release/util.js:16:23)
1|martin   |     at Promise._settlePromiseFromHandler (/home/kye/apps/martin-discord-bot/node_modules/bluebird/js/release/promise.js:512:31)
1|martin   |     at Promise._settlePromise (/home/kye/apps/martin-discord-bot/node_modules/bluebird/js/release/promise.js:569:18)
1|martin   |     at Promise._settlePromise0 (/home/kye/apps/martin-discord-bot/node_modules/bluebird/js/release/promise.js:614:10)
1|martin   |     at Promise._settlePromises (/home/kye/apps/martin-discord-bot/node_modules/bluebird/js/release/promise.js:693:18)```

Issue Analytics

State:
Created 6 years ago
Comments:15 (4 by maintainers)

Top GitHub Comments

7reactions

lingzcommented, Dec 29, 2017

Fixed on my side just by declaring after my import:

if (global.CanvasGradient === undefined) {
  global.CanvasGradient = function() {};
}

Will make it pass the instanceof check.

3reactions

sedouardcommented, Aug 4, 2017

I agree. The fact that the demo site had no problem tells me it is an OS specific issue. (The demo site is running Ubuntu). Going to close this out.

Top Results From Across the Web

CanvasGradient is not defined · Issue #45 - GitHub

Hi, I'm using this lib; I try to use charjs plugin colorschemes and i implement that following way import { CanvasRenderService } from ......

Error ReferenceError: CanvasGradient is not defined

I am trying to create a line chart using chartjs-node package. Below is the code. When I give the data of dataset as...

Error ReferenceError: CanvasGradient is not defined-node.js

[Solved]-Error ReferenceError: CanvasGradient is not defined-node.js ... In canvas for node implementation you need to export CanvasGradient class yourself.

CanvasGradient - Web APIs - MDN Web Docs

The CanvasGradient interface represents an opaque object describing a gradient. It is returned by the methods CanvasRenderingContext2D.

CanvasGradient JavaScript API - JavaScripture

Instance Methods. addColorStop(offset : Number, color : String) : undefined. Adds a color stop ...