Skip to content

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

@T-Ndev

Description

@T-Ndev

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

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