The issue is as follows. The code prints three arcs. The first arc spans three rows. The second has two rows and the third has only one row. Each Arc has different color and three are coming out of one vertex. But each of them have different depths.Ideal way should be each layer having its own colors but as we draw there is a gradeint on each layer.
I believe in WEBGL as we color the vertex and use the shaders to draw, the vertex color is propagated and it is forming gradients. But as they are using different depths for each layer and each layer has different color the gradient should n’t have formed.
I have tried instead of drawing all the layers at once , drawing each layer might fix this issue and it has worked. The issue might have resolved now but I am not sure really happening.