Indie game storeFree gamesFun gamesHorror games
Game developmentAssetsComics
SalesBundles
Jobs
Tags

Error when using radialGradient

A topic by Itooh created Jun 25, 2018 Views: 394 Replies: 2
Viewing posts 1 to 3

I recently uploaded a game on itch.io, and since it was a web game using mostly Phaser and Tone.JS, I expected it would work on the itch app. Unfortunately, it crashes quite soon, with this error:

Uncaught DOMException: Failed to execute 'addColorStop' on 'CanvasGradient': The value provided ('rgb(208, 244, 250, 0.6)') could not be parsed as a color. 

The lines causing this are:

// particleBmd.ctx is a CanvasRenderingContext2D
var gradient = particleBmd.ctx.createRadialGradient(_constants2.default.PARTICLE_SIZE / 2, _constants2.default.PARTICLE_SIZE / 2, 2, _constants2.default.PARTICLE_SIZE / 2, _constants2.default.PARTICLE_SIZE / 2, _constants2.default.PARTICLE_SIZE / 2);
gradient.addColorStop(0, 'rgb(' + particleColor.r + ', ' + particleColor.g + ', ' + particleColor.b + ', 0.6)');

I'm surprised, since this is only standard javascript!

I guess it might be related to electron. Though it seems itch already uses the latest version. The closest issue I could find is this one:

https://github.com/thomaslindstrom/color-picker/issues/136

But as you can see it is slightly different (here it's rgb(Nan, NaN, NaN, 1) that causes the error).

Should I create an issue on github? I'm not sure if this is related to itch or electron. If you want to reproduce it, here is the game. It should start properly, then it crashes as soon as the player try to shoot (by clicking anywhere).

Moderator

Perhaps because that would be a rgba value, as opposed to rgb. Maybe some browser engines tolerate using the latter with four values and others don't.

Indeed, it was exactly that! I've definitely learned something.

Thank you very much!