I cannot manage to draw a circle using triangle fan. The code bellow is in a javascript file that would be called to create the circle. With help of a tutorial, this is what I was able to gather for a function to draw it.

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);    
}

And this would be the function to render it.

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);
    }