Как я могу анимировать объект в WebGL (изменить конкретные вершины, а не полные преобразования) - PullRequest
Новая
       25

Как я могу анимировать объект в WebGL (изменить конкретные вершины, а не полные преобразования)

20 голосов
/ 31 марта 2011

Хорошо,

Я новичок в 3D-графике и хочу анимировать отдельные конкретные вершины в модели (НЕ преобразуется вся модель) .Мой сценарий в значительной степени основан на учебнике NEHE по webgl.В этом руководстве все вершины объекта хранятся в буфере, который инициализируется один раз при первом запуске программы.Вот код инициализации: * Примечание вершины содержат массив вершин 

vertexBuffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer);
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
vertexBuffer.itemSize = 3;
vertexBuffer.numItems = parseInt(vertices.length/vertexBuffer.itemSize);

Теперь, поскольку они инициализируются в начале, очевидно, что изменение массива вершин ничего не даст.Поэтому мне было интересно, как лучше всего изменить вершины в режиме реального времени, сохраняя при этом его достаточную эффективность для бесперебойной работы.

Можно ли каким-либо образом перепривязать буфер, например, повторно запускать этот код при каждом такте анимации? 

gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer);
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);

Приветствия, J

Ответы [ 2 ]

47 голосов
/ 31 марта 2011

Ладно, после огромного количества копаний в сети.Я обнаружил, что следующие изменения должны быть сделаны;Прежде всего, вы должны сделать буфер вершинного массива динамическим.это стало возможным благодаря использованию перечислителя "gl.DYNAMIC_DRAW", где ранее в большинстве учебных пособий мы использовали "gl.STATIC_DRAW".В результате получается следующее: 

gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.DYNAMIC_DRAW);

Второе изменение должно быть запущено в вашей функции цикла (или тика, или анимации).Новая функция вызывается для обновления массива.Сначала вы должны сначала связать буфер предыдущего динамического массива: 

gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer);

, а затем после этого вы обновите старые вершины следующей функцией: 

gl.bufferSubData(gl.ARRAY_BUFFER, 0, new Float32Array(vertices));

Где параметры,,

Источник: http://www.khronos.org/files/webgl/webgl-reference-card-1_0.pdf

Надеюсь, это кому-нибудь поможет:)

J

4 голосов
/ 03 августа 2012

В качестве альтернативы вы можете выполнить шаги, описанные в http://learningwebgl.com/blog/?p=239.

Здесь они сохраняют постоянные данные вершины.Вместо этого они продолжают изменять матрицу mvMatrix, которая обеспечивает требуемые переводы и повороты.Затем mvMatrix подается в шейдер через однородную переменную, а затем умножается на положение вершины, чтобы получить новые положения вершины.Надеюсь, это поможет.

...