Javascript 如何使用WebGL在一个程序中使用不同的DrawArray类型?

Javascript 如何使用WebGL在一个程序中使用不同的DrawArray类型?,javascript,webgl,draw,Javascript,Webgl,Draw,我有一个关于如何实际实现教授要求的内容的小背景作业(我也是Javascript的新手,但我对c和c++了解很多)。WebGL程序必须呈现3种不同类型的drawArray调用:点、三角形和线 我分别为每种类型绘制了不同的数组,我知道如何一次绘制一种类型,但我不确定如何绘制3种不同的类型 所有的向量应该放在一个巨大的数组中吗?我尝试了这种方法,第一个三角形将正确绘制,但使用其他两种类型再次调用DrawArray,并将偏移量设置为直线的“第一个”索引,然后设置为“点”,这给了我错误: WebGL er

我有一个关于如何实际实现教授要求的内容的小背景作业(我也是Javascript的新手,但我对c和c++了解很多)。WebGL程序必须呈现3种不同类型的drawArray调用:点、三角形和线

我分别为每种类型绘制了不同的数组,我知道如何一次绘制一种类型,但我不确定如何绘制3种不同的类型

所有的向量应该放在一个巨大的数组中吗?我尝试了这种方法,第一个三角形将正确绘制,但使用其他两种类型再次调用DrawArray,并将偏移量设置为直线的“第一个”索引,然后设置为“点”,这给了我错误:

WebGL error INVALID_OPERATION in drawArrays(ONE, 36, 2)
WebGL error INVALID_OPERATION in drawArrays(NONE, 40, 1)
或者,为每种类型使用单独的数组,并为每种类型设置缓冲区,当有多个数组设置为“gl”->(getWebGLContext(canvas))时,如何处理DrawArray

作为参考,这是教授指定的:

    Write a WebGL program that displays a rotating pendulum.  The
    pendulum bob is free to rotate through 360 degrees about an anchor 
    point at the center of the canvas.  The pendulum has the following 
    three components.

    1)  The anchor point is a green square centered at the origin 
        (0,0) with point size = 5 pixels.

    2)  The bob is a blue hexagon of radius r = 0.1.  Render this with
        a triangle fan centered at the origin (along with a ModelView
        matrix that translates and rotates).

    3)  The bob is attached to the anchor point by a rigid red wire of
        length l = 0.8.

    Use global variables for the point size of the anchor, the radius
    of the bob, the length of the wire, and the angular velocity of 
    rotation in degrees per second.  Set the initial angular velocity
    to 45 and allow an interactive user to increase or decrease the
    value in multiples of 10 degrees per second with button presses.

这取决于你。只要您正确指定内容,WebGL就不在乎。在您的情况下,如果将它们放在相同的缓冲区中,则需要为每个数据块指定偏移量

最常见的方法是将每个draw调用的数据放在它自己的缓冲区中

另外,
drawArrays
的第一个参数是基本类型(点、线、三角形等),而不是您在问题中提出的一个或一个

你可能想看看