Skip to content

Graphical option with ImageData doesn't work in WebWorker #812

Open
@T-Ndev

Description

Issue

Graphical option with ImageData doesn't work in WebWorker but when I use {mode: 'cpu'} it works.

Env

Google Chrome
FireFox

Windows 11 22H2
i7 8565U
UHD Graphics 620

Windows 11 22H2
i7 1255U
Intel Iris Xe Graphics

Code

// doesn't work
const gpu = new GPU();
const graphicalTest = gpu.createKernel(function(data) {
	const [r, g, b, a] = data[this.thread.y][this.thread.x];
	this.color(r, g, b, a);
}, {
	output: [width, height],
	graphical: true,
});
graphicalTest(imageData/* ImageData Object */);
const newImageData = new ImageData(Uint8ClampedArray.from(graphicalTest.getPixels()), this.#width, this.#height);
// > gpu-browser.min.js:28 Uncaught (in promise) Error: Error compiling fragment shader: ERROR: 0:465: 'color' : no matching overloaded function found


// works
const gpu = new GPU({mode: 'cpu'});
const graphicalTest = gpu.createKernel(function(data) {
	const [r, g, b, a] = data[this.thread.y][this.thread.x];
	this.color(r, g, b, a);
}, {
	output: [width, height],
	graphical: true,
});
graphicalTest(imageData/* ImageData Object */);
const newImageData = new ImageData(Uint8ClampedArray.from(graphicalTest.getPixels()), this.#width, this.#height);



// doesn't work
const gpu = new GPU();
const graphicalTest = gpu.createKernel(function(data) {
	const [r, g, b, a] = data[this.thread.y][this.thread.x];
	const sum = r + g + b + a;
	this.color(r, g, b, a);
}, {
	output: [width, height],
	graphical: true,
});
graphicalTest(imageData/* ImageData Object */);
const newImageData = new ImageData(Uint8ClampedArray.from(graphicalTest.getPixels()), this.#width, this.#height);
// > Uncaught (in promise) Error: Unhandled binary expression between Number & Array(4) on line 2, position 3:]


// works
const gpu = new GPU({mode: 'cpu'});
const graphicalTest = gpu.createKernel(function(data) {
	const [r, g, b, a] = data[this.thread.y][this.thread.x];
	const sum = r + g + b + a;
	this.color(r, g, b, a);
}, {
	output: [width, height],
	graphical: true,
});
graphicalTest(imageData/* ImageData Object */);
const newImageData = new ImageData(Uint8ClampedArray.from(graphicalTest.getPixels()), this.#width, this.#height);

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions