I have developed an algorithm that allows users to input data or a function and then generates a graphical representation of the function. It essentially creates a surface map, similar to the one you can see here. The graphing functionality is working well, but I want to enhance it by adding black lines connecting points, just like in the example. However, I keep encountering the GL_INVALID_OPERATION error: glDrawElements: attempt to access out-of-range vertices in attribute 2. This error indicates that I am trying to draw something beyond the buffer range, but I'm struggling to pinpoint the issue. I have verified that the variables used for the x and y lengths provided for mapping align with the number of x and y indices. For instance, I set the repeat value to 76 for both x and y for a mesh containing 76 x entries and 76 y entries, totaling 5776 points.
The example utilizes a parametric geometry, whereas I need to use a standard THREE.Geometry because my system sometimes accepts data rather than just functions. Despite following the example closely, I continue to face the error. Perhaps I am misunderstanding the necessary mapping numbers for the texture repeat. My understanding is that they should reflect the number of X and Y points, but there may be other considerations at play.
Below is the method where I define my meshes:
Surface.prototype.setMeshes =function(DataID, callback)
{ var graphMesh={};
var PlotID=this.Format_id;
if (PlotID['Chart_dataobj'][DataID]['type']=="Surface")
{ if (PlotID['Chart_dataobj'][DataID]['sWireFrame']=="Solid")
{
var wireTexture = new THREE.ImageUtils.loadTexture( 'http://www.cadwolf.com/Images/square.png' );
wireTexture.wrapS = wireTexture.wrapT = THREE.RepeatWrapping;
wireTexture.repeat.set( parseInt(PlotID['Chart_dataobj'][DataID].xLength), parseInt(PlotID['Chart_dataobj'][DataID].yLength) );
wireMaterial = new THREE.MeshBasicMaterial( { map: wireTexture, vertexColors: THREE.VertexColors, side:THREE.DoubleSide } );
wireMaterial.map.repeat.set( parseInt(PlotID['Chart_dataobj'][DataID].xLength), parseInt(PlotID['Chart_dataobj'][DataID].yLength) );
graphMesh = new THREE.Mesh( window[PlotID]['Chart_dataobj'][DataID].surfaceGeometry, wireMaterial );
graphMesh.doubleSided = true;
}
}
graphMesh.id = DataID;
graphMesh.name = DataID;
window[PlotID].Scene.add(graphMesh);
if (typeof(callback)=="function") { callback(); }
}
While I am confident in the correctness of the surface geometry, it appears that there is a discrepancy in the number of elements I have compared to the repeat values. Additionally, any insights on what attribute 2 represents would be greatly appreciated.
Thank you