C# 在openGL中绘制二维多边形
我正在使用DuoCode尝试在webGL中绘制二维多边形。为此,我编写了特定的着色器,这些着色器采用2D顶点和z位置以及一些其他数据:C# 在openGL中绘制二维多边形,c#,opengl-es,webgl,sprite,C#,Opengl Es,Webgl,Sprite,我正在使用DuoCode尝试在webGL中绘制二维多边形。为此,我编写了特定的着色器,这些着色器采用2D顶点和z位置以及一些其他数据: <!-- Fragment shader program --> <script id="shader-fs" type="x-shader/x-fragment"> varying highp vec2 vTextureCoord; uniform highp vec3 uColor; uniform sampl
<!-- Fragment shader program -->
<script id="shader-fs" type="x-shader/x-fragment">
varying highp vec2 vTextureCoord;
uniform highp vec3 uColor;
uniform sampler2D uSampler;
uniform int uSamplerCount;
void main(void) {
highp vec4 texColor =vec4(uColor, 1.0);
if(uSamplerCount > 0)
texColor = texture2D(uSampler, vTextureCoord);
gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0);
}
</script>
<!-- Vertex shader program -->
<script id="shader-vs" type="x-shader/x-vertex">
attribute highp vec2 aVertexPosition;
attribute highp vec2 aTextureCoord;
uniform highp vec2 uPosition;
uniform highp float uZLayer;
varying highp vec2 vTextureCoord;
void main(void) {
gl_Position = vec4(uPosition + aVertexPosition, uZLayer, 1.0);
vTextureCoord = aTextureCoord;
}
</script>
a表示属性,u表示位置
图形本身如下所示:
public void UpdateBuffers()
{
System.Console.WriteLine("Updating buffers");
System.Console.Write("Vertices: ");
for (int i = 0; i < rotatedPoints.length; i++)
System.Console.Write(rotatedPoints[i] + ", ");
System.Console.WriteLine(" ");
System.Console.Write("texCoords: ");
for (int i = 0; i < texCoords.length; i++)
System.Console.Write(texCoords[i] + ", ");
System.Console.WriteLine(" ");
System.Console.Write("Triangles: ");
for (int i = 0; i < triangles.length; i++)
System.Console.Write(triangles[i] + ", ");
System.Console.WriteLine(" ");
gl.bindBuffer(GL.ARRAY_BUFFER, bVertexPositions);
gl.bufferData(GL.ARRAY_BUFFER, rotatedPoints.As<ArrayBufferView>(), GL.STATIC_DRAW);
gl.bindBuffer(GL.ARRAY_BUFFER, bTextureCoords);
gl.bufferData(GL.ARRAY_BUFFER, texCoords.As<ArrayBufferView>(), GL.STATIC_DRAW);
gl.bindBuffer(GL.ELEMENT_ARRAY_BUFFER, bIndices);
gl.bufferData(GL.ELEMENT_ARRAY_BUFFER, triangles.As<ArrayBufferView>(), GL.STATIC_DRAW);
}
gl.viewport(0, 0, (int)canvas.width, (int)canvas.height);
gl.clear(GL.COLOR_BUFFER_BIT | GL.DEPTH_BUFFER_BIT);
testSprite.Draw(aVertexPosition, aTextureCoord, uColor, uPosition, uZLayer, uSampler, uSamplerCount);
public void Draw(uint aVertexPosition, uint aTextureCoord,
WebGLUniformLocation uColor, WebGLUniformLocation uPosition, WebGLUniformLocation uZLayer, WebGLUniformLocation uSampler, WebGLUniformLocation uSamplerCount)
{
//position
gl.uniform2f(uPosition, this.position.x, this.position.y);
gl.uniform1f(uZLayer, this.position.z);
gl.uniform3f(uColor, 1f, 0.5f, 0.5f);
gl.uniform1i(uSamplerCount, 0);
//vertex data
gl.bindBuffer(GL.ARRAY_BUFFER, bVertexPositions);
gl.vertexAttribPointer(aVertexPosition, 2, GL.FLOAT, false, 0, 0);
gl.bindBuffer(GL.ARRAY_BUFFER, bTextureCoords);
gl.vertexAttribPointer(aTextureCoord, 2, GL.FLOAT, false, 0, 0);
gl.bindBuffer(GL.ELEMENT_ARRAY_BUFFER, bIndices);
//texture
// gl.activeTexture(GL.TEXTURE0);
// gl.bindTexture(GL.TEXTURE_2D, texture);
// gl.uniform1i(uSampler, 0);
//draw
gl.drawElements(GL.TRIANGLES, triangles.length, GL.UNSIGNED_SHORT, 0);
}
JS控制台中同样没有错误。
不幸的是,屏幕一直是黑色的。我认为这一错误可能与vertice阵列有两个组件有关,但我无法理解。我以为我已经理解了openGL的基础知识,但显然我错了,因为这应该不是一个很难解决的问题。但我什么也画不出来。如果你需要它,我可以发布剩下的代码,比如缓冲区的创建,但我认为我的错误一定在这段代码的某个地方。我希望这不是一个太大的问题,在我的代码帖子中找到了bug,但是我真的不知道从这里走到哪里,我只是不能找出我的错误
编辑:发现我的错误,我将int传递给元素索引列表,但我将它们标记为ushort错误在这里:
gl.drawElements(GL.TRIANGLES, triangles.length, GL.UNSIGNED_SHORT, 0);
三角形实际上是int类型,而不是ushort我想看看你的完整代码。你能为这个制作一个plunker或类似的吗?乍一看,我的直觉是你的顶点超出了-1到1的范围,除非在某个地方用同质坐标进行缩放,或者实际上没有任何东西在编译你的脚本。精灵代码:程序代码:剩余代码: