Как использовать разные типы drawArrays в одной программе с помощью WebGL?

Question

У меня есть задание с небольшим контекстом о том, как на самом деле реализовать то, что спрашивает профессор (я тоже новичок в Javascript, но знаю тонну о c и C++). Программа WebGL должна отображать 3 разных типа вызовов drawArray: POINTS, TRIANGLE_FAN и LINES.

У меня есть разные массивы для каждого, соответственно, и я знаю, как рисовать один тип за раз, но я не уверен, как рисовать 3 разных типа.

Должны ли все векторы быть помещены в один гигантский массив? Я попытался сделать этот метод, и первый TRIANGLE_FAN будет рисовать правильно, но снова вызовет drawArrays с двумя другими типами и установит смещение как «первый» индекс строки, а затем «точку», дал мне ошибки:

WebGL error INVALID_OPERATION in drawArrays(ONE, 36, 2) 
WebGL error INVALID_OPERATION in drawArrays(NONE, 40, 1) 

Альтернативно, используя отдельные массивы для каждого типа, а также создание буферов для каждого, как вы идете о drawArrays, когда есть больше чем один массив установлен в «ГЛ» -> (getWebGLContext (холст))?

Для справки, это то, что профессор назначается:

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. 

Answer 1

Это до вас. WebGL не волнует, пока вы правильно определяете вещи. В вашем случае, если вы поместите их в один и тот же буфер, вам нужно указать смещения для каждой детали.

Наиболее распространенным способом было бы поместить данные для каждого вызова ничьей в свои собственные буферы.

также первый аргумент drawArrays является примитивным типом (точка, линия, треугольники, и т.д.) не ONE или NONE не вы положили в своем вопросе

Вы можете проверить некоторые tutorials on webgl