No puedo dibujar un círculo usando un abanico triangular. El siguiente código está en un archivo javascript que se llamaría para crear el círculo. Con la ayuda de un tutorial, esto es lo que pude recopilar para una función para dibujarlo.
function createCircleGeometry(radius, segments) { var pi2 = 2 * Math.PI; var step = pi2 / segments; var points = []; var colors = []; var tcolors = [ vec3(1.0, 0.0, 0.0), vec3(0.0, 1.0, 0.0), vec3(0.0, 0.0, 1.0), ]; var x; var y; var z; var noVer = segments + 2; var circleVerticesX = []; var circleVerticesY = []; var circleVerticesZ = []; circleVerticesX.length = noVer; circleVerticesY.length = noVer; circleVerticesZ.length = noVer; circleVerticesX[0] = x; circleVerticesY[0] = y; circleVerticesZ[0] = z; for ( let i = 1; i < noVer; i++ ) { circleVerticesX[i] = x + ( radius * cos( i * step ) ); circleVerticesY[i] = y + ( radius * sin( i * step) ); circleVerticesZ[i] = z; } var allCircleVertices =[]; allCircleVertices.length = noVer * 3; for ( let i = 0; i < noVer; i++ ) { allCircleVertices[i * 3] = circleVerticesX[i]; allCircleVertices[( i * 3 ) + 1] = circleVerticesY[i]; allCircleVertices[( i * 3 ) + 2] = circleVerticesZ[i]; points.push(circleVerticesZ[i],circleVerticesX[i],circleVerticesY[i]); colors.push(tcolors[0],tcolors[1],tcolors[2]); } return flattenArrays(points, colors); }Y esta sería la función para renderizarlo.
function render() { gl.clear(gl.COLOR_BUFFER_BIT); gl.enableVertexAttribArray(colorAttribLocation); gl.vertexAttribPointer(positionAttribLocation, 3, gl.FLOAT, false, 0, 0); gl.vertexAttrib4f(colorAttribLocation, 1, 1 , 1, 1); gl.drawArrays(gl.TRIANGLE_FAN, 0, noVer); }Así que tomé su código y lo depuré paso a paso . Por eso yo:
vec3 como function vec3 (x,y,z) {return [x,y,z]}sin y cos por const sin = Math.sin, cos = Math.cos; (¿por qué alias esos pero no Math.PI ?)flattenArrays devolvería, pero no necesitaba hacerlo ya que el error ocurre antes de eso Usted declara variables x,y,z y las usa sin haberles asignado nada, lo que da como resultado valores NaN en todas partes. Inicializarlos a 0 resultó en una matriz de puntos que parecía razonable a primera vista.