Glsl WebGL统一参数类型

我正在尝试使用该库编写WebGL图像过滤器。我的过滤器应该采用一个数组，其中每个内部数组代表一种可能的像素颜色。然后，该函数将决定使用外部数组中的哪个元素

我已经成功地编写了一个简单的GLSL函数，它将单色数组作为“统一”参数，但是我不知道如何传递嵌套数组。您能给我指出正确的类型声明来接受这个代码段中的浮点嵌套数组吗

var fragmentSrc=[
“uniform vec4 colorList；”，//我在这里需要什么类型来传递下面注释中的ARRY？
“void main（）{”，
“浮动灰度=（gl_FragCoord.r*299.0/1000.0）+（gl_FragCoord.g*587.0/1000.0）+（gl_FragCoord.b*114.0/1000.0）；”，
“浮点sigmoidThreshold=1.0/（1.0+pow（2.718281828459045235602874713527，（（灰度-128.0）/32.0））；”，
“gl_FragColor=颜色列表；”，
"}",
];
var renderer=PIXI.autodetectedrenderer（750750）；
document.body.appendChild（renderer.view）；
var stage=new PIXI.Container（）；
函数CustomFilter（片段源）{
PIXI.Filter.call（这个，
无效的
碎片源
);
}
CustomFilter.prototype=Object.create（PIXI.Filter.prototype）；
CustomFilter.prototype.constructor=CustomFilter；
var bg=new PIXI.Graphics（）；
bg.drawRect（0,0,375,375）；
bg.endFill（）；
阶段。添加儿童（bg）；
var filter=new CustomFilter（fragmentSrc.join（'\r\n'））；
filter.uniforms.colorList=[1.0,1.0,0.0,1.0]//要传递数组，如：
// [[1.0, 1.0, 0.0, 1.0], [0.0, 0.0, 1.0, 1.0]]
bg.filters=[filter]；
渲染器。渲染（舞台）
我将代码更改为

var fragmentSrc = `
  uniform vec4 colorList[10]; 
  void main() {
    float GrayScale =  (gl_FragCoord.r * 299.0 / 1000.0) + (gl_FragCoord.g * 587.0 / 1000.0) + (gl_FragCoord.b * 114.0 / 1000.0);
    float sigmoidThreshold = 1.0 / (1.0 + pow(2.7182818284590452353602874713527, (-((GrayScale - 128.0) /32.0))));
    gl_FragColor = colorList[9];
  }
`;

var filter = new CustomFilter(fragmentSrc);
console.log(filter.uniforms);

它会打印出来


所以这是有效的

filter.uniforms.colorList = [
   1, 0, 0, 0,     // 0
   1, 1, 0, 0,     // 1
   0, 1, 0, 0,     // 2
   0, 1, 1, 0,     // 3 
   0, 0, 1, 0,     // 4
   1, 0, 1, 0,     // 5
   .5, 0, 0, 0,    // 6
   0, .5, 0, 0,    // 7
   1, 1, 0, 1,     // 8
   .5, .5, .7, 1., // 9
];

还有这个

filter.uniforms.colorList = new Float32Array([
   1, 0, 0, 0,     // 0
   1, 1, 0, 0,     // 1
   0, 1, 0, 0,     // 2
   0, 1, 1, 0,     // 3 
   0, 0, 1, 0,     // 4
   1, 0, 1, 0,     // 5
   .5, 0, 0, 0,    // 6
   0, .5, 0, 0,    // 7
   1, 1, 0, 1,     // 8
   .5, .5, .7, 1., // 9
]);

等等

如果您确实需要JavaScript中的数组，可以这样做，将
ArrayBufferView
s放入更大的数组中

const colorValues = [];
for (let i = 0; i < filter.uniforms.colorList.length; i += 4) {
  const buffer = filter.uniforms.colorList.buffer;
  const byteOffset = i * Float32Array.BYTES_PER_ELEMENT;
  const length = 4;
  colorValues.push(new Float32Array(buffer, byteOffset, length));
}


var fragmentSrc=`
统一vec4颜色列表[10]；//我需要什么类型的文件才能通过下面评论中的ARRY？
void main（）{
浮动灰度=（gl_FragCoord.r*299.0/1000.0）+（gl_FragCoord.g*587.0/1000.0）+（gl_FragCoord.b*114.0/1000.0）；
float sigmoidThreshold=1.0/（1.0+pow（2.7182818284590453602874713527，（（灰度-128.0）/32.0））；
gl_FragColor=颜色列表[9]；
}
`;
var renderer=PIXI.autodetectedrenderer（750750）；
document.body.appendChild（renderer.view）；
var stage=new PIXI.Container（）；
函数CustomFilter（片段源）{
PIXI.Filter.call（这个，
无效的
碎片源
);
}
CustomFilter.prototype=Object.create（PIXI.Filter.prototype）；
CustomFilter.prototype.constructor=CustomFilter；
var bg=new PIXI.Graphics（）；
bg.drawRect（0,0,375,375）；
bg.endFill（）；
阶段。添加儿童（bg）；
var filter=新的CustomFilter（fragmentSrc）；
常量colorValues=[]；
for（设i=0；i
在着色器中声明一个vec4数组，打开开发工具，放置断点以了解“filter.uniforms.colorList”的外观。
colorValues[9].set([1, 1, 0, 1]);