如何解决Webgl2:如何在一个drawArrays调用中的一个缓冲区中设置不同的颜色
我正在尝试使用webg2和javascript渲染100K到1M的矩形。为此,我要做一个一个缓冲区,并给一个 drawArray调用,它只带有一个RGBA颜色阵列。我将在下面附加我的drawSHape函数代码段。
// This function is used to draw any shape provided coordinates,colour and drawing mode.
const drawShape = (coords,color,drawingMode) => {
let numberOfDies = 0;
renderingdata = coords;
numberOfDies = renderingdata.length / 12;
console.log("DieWidth:",dieWidth,"DieHeight",dieHeight);
console.log("Rendering Dies:",numberOfDies);
// Step 3
let data = new Float32Array(renderingdata);
let buffer = utils.createAndBindBuffer(
gl,gl.ARRAY_BUFFER,gl.STATIC_DRAW,data
);
// Step 4
gl.useProgram(program);
utils.linkGPUAndCPU(
{
program: program,buffer: buffer,dims: 2,gpuVariable: "position",},gl
);
let reticleColor = gl.getUniformLocation(program,"reticleColor");
gl.uniform4fv(reticleColor,color);
// Step 5
gl.drawArrays(drawingMode,renderingdata.length / 2);
};
问题是我无法绘制100k到1M不同颜色的矩形。我应该如何以最优化的方式为矩形/目标设置/提供不同的颜色?
作为参考,我附上了屏幕截图。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。