Почему не срабатывает смещение при инстансинге?

Question

[NimuraF]

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

Код вершинного шейдера:

#version 460 core

layout (location = 0) in vec3 aPos;

uniform vec2 offsets[100];

void main()
{
   vec3 offset = offsets[gl_InstanceID];
   gl_Position = vec4(aPos + offset, 0.0, 1.0);
}

Код фрагментного шейдера:

#version 460 core

out vec4 color;

void main()
{
   color = vec4(1.0f, 1.0f, 0.0f, 1.0f);
}

Перед основным циклом заполняю массив offset из вершинного шейдера.

glm::vec2 translations[100];
    int index = 0;
    float offset = 0.1f;
    for (int y = -10; y < 10; y += 2)
    {
        for (int x = -10; x < 10; x += 2)
        {
            glm::vec2 translation;
            translation.x = (float)x / 10.0f + offset;
            translation.y = (float)y / 10.0f + offset;
            translations[index++] = translation;
        }
    }

    glUseProgram(shaderProgramForRaindrops);
    for (unsigned int i = 0; i < 100; i++)
    {
        stringstream ss;
        string index;
        ss << i;
        index = ss.str();
        GLint offsetArray = glGetUniformLocation(shaderProgramForRaindrops, ("offsets[" + index + "]").c_str());
        glUniform2fv(offsetArray, 0, glm::value_ptr(translations[i]));
    }

Координаты самого квадрата:

GLfloat raindrops[] = {
        -0.05f,  0.05f, 0.0f,
         0.05f, -0.05f, 0.0f,
        -0.05f, -0.05f, 0.0f,

        -0.05f,  0.05f, 0.0f,
         0.05f, -0.05f, 0.0f,
         0.05f,  0.05f, 0.0f
    };

Привязываю к VAO:

glBindVertexArray(VAOs[2]);

        glBindBuffer(GL_ARRAY_BUFFER, VBOs[2]);
        glBufferData(GL_ARRAY_BUFFER, sizeof(raindrops), raindrops, GL_STATIC_DRAW);

        glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(GLfloat), (GLvoid*)0);
        glEnableVertexAttribArray(0);

    glBindVertexArray(0);

Ну и в основном цикле через DrawArrayInstances пытаюсь отрисовать эти самые квадраты.

/* Третья программа */
        glUseProgram(shaderProgramForRaindrops);
        glBindVertexArray(VAOs[2]);
        glDrawArraysInstanced(GL_TRIANGLES, 0, 6, 100);
        glBindVertexArray(0);

В результате я получаю один квадрат по центру (что, в общем-то, логично, базовые координаты), и никаких квадратов по смещению, в чём может быть проблема?

Comments

[Евгений Шатунов]

NimuraF , освободи код шейдеров от мишуры кавычек.
Используй или сырые строки (6), или просто перепиши сюда только их текст.
Сейчас код шейдеров нечитаемый.

[NimuraF]

Евгений Шатунов, там 5 строчек всего :/

Вершинный:

#version 460 core

layout (location = 0) in vec3 aPos;

uniform vec2 offsets[100];

void main()
{
   vec3 offset = offsets[gl_InstanceID];
   gl_Position = vec4(aPos + offset, 0.0, 1.0);
}

Фрагментный:

#version 460 core

out vec4 color;

void main()
{
color = vec4(1.0f, 1.0f, 0.0f, 1.0f);
}

[Евгений Шатунов]

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

Я посмотрю код, но уже вечером. Навскидку в нем много нестыковок.
aPos + offset - размерность надо выровнять.
uniform vec2 offsets[100]; - какой размер одного элемента? Думаю - 16Б.
glGetUniformLocation(...); - так можно, но загрузка значений для массивов делается иначе.

[NimuraF]

Евгений Шатунов, насчёт кода, понял, я в графике фулл новичок, мне казалось, что на небольших шейдерах так наоборот будет проще анализировать код.

Буду премного благодарен за помощь, особенно интересует как правильно загружать массивы :)

Answer 1

[Евгений Шатунов]

Что такое инстансинг по своей сути?
Вот у нас есть геометрия и параметры ее обработки. Речь только о стадии обработки вершин.
Самая суть инстансинга в том, что геометрия у нас как бы находится в состоянии суперпозиции. Примитив у нас один, DIP тоже один, но в атрибутах примитива заложено что-то особенное, что заставляет увидеть его сразу во многих местах.
Это самое особенное - это атрибуты инстанса.

По умолчанию все атрибуты вершины являются атрибутами примитива. Когда работает DIP, вершинный шейдер запускается для обработки каждой отдельной вершины примитива. Когда инстансинг отключен, можно считать что все вершины примитива принадлежат ровно одному инстансу, для которого атрибутов не задано.
Но если примитив требуется отрисовать с использованием инстансинга, в его атрибутах должны находиться и атрибуты инстанса. Тогда во время работы уже DIPI вершинный шейдер будет запущен для каждой вершины примитива каждого инстанса.

Поэтому самым первым этапом включения инстансинга будет именно новый буфер атрибутов в шейдере.

layout (location = 0) in vec3 aPos;
layout (location = 1) in vec2 aOffset;

aOffset не должен быть uniform-ом. Это должен быть именно атрибут инстанса.
Uniform-ами стоит делать другие вещи, не уникальные между инстансами. Uniform-ы для инстанса имеются сразу и все. Поэтому рационально в них держать только то, что разные инстансы используют совместно.
Например - это могут быть цвета фракций или параметры костей скелетов в разных позах.

Примерный код вершинного шейдера

#version 460 core

layout (location = 0) in vec3 aPos;
layout (location = 1) in vec2 aOffset;

void main()
{
   gl_Position = vec4(aPos + aOffset, 0.0, 1.0);
}

Для указания того, что в буфере находятся атрибуты инстанса, следует использовать glVertexAttribDivisor[?].
У тебя, скорее всего, это будет выглядеть так: glVertexAttribDivisor( 1, 6 );.
А внутри буфера у тебя должно быть то, что сейчас записывается в glm::vec2 translations[100].

Как примерно может заполняться буфер атрибутов инстанса

glm::vec2 translations[100];
int index = 0;
float offset = 0.1f;
for (int y = -10; y < 10; y += 2)
{
	for (int x = -10; x < 10; x += 2)
	{
		glm::vec2 translation;
		translation.x = (float)x / 10.0f + offset;
		translation.y = (float)y / 10.0f + offset;
		translations[index++] = translation;
	}
}

glBindBuffer(GL_ARRAY_BUFFER, VBOs[3]);
glBufferData(GL_ARRAY_BUFFER, sizeof(translations), translations, GL_STATIC_DRAW);

glVertexAttribPointer(1, 2, GL_FLOAT, GL_FALSE, sizeof(glm::vec2), (GLvoid*)0);
glVertexAttribDivisor(1, 6);
glEnableVertexAttribArray(1);

С этого момента инстансинг заведется как положено. Просто убираем uniform, меняем подготовку его значений на подготовку еще одного буфера вершин, добавляем код установки этого нового буфера, задействуем его значения в шейдере и все. Эту теорию тебе остается только адаптировать для своего кода.
Чтобы разобраться почему у тебя конкретно сейчас рисуется неправильно, тебе нужно установить графический отладчик и проанализировать через него презентацию одного кадра. Советую поставить Renderdoc и научиться полноценно работать с ним. Без запуска твоего кода и анализа кадра выяснить причину неправильной работы практически невозможно.

Comments

[NimuraF]

Только сейчас удалось прочитать :)

Честно говоря, не совсем понимаю, что из себя представляет этот самый массив из вектор с n=2, загруженный в буфер, ну, т. е., это вообще что за объект такой? Вот на примере того же квадрата, я загружаю в VBO 6 вершин, указываю шаг в 3 элемента (3 координаты) и на основе этого opengl отрисовывает мне пресловутый квадрат. В юниформах я непосредственно брал массив, который и представлял как обычный массив в понимании программирования, а от того и становилось понятно, что та самая особенность будет браться на основе переменной gl_InstanceID. Здесь же я, по сути, делаю то же самое, только aOffset - это какой-то длинный пак данных, в котором я просто указываю шаг через glVertexAttribDivisor(1, 6)?

Так же небольшой нюанс возник с VAO, вот, допустим, я передаю те самые 2 (0 и 1) атрибута, т.е. мой VAO будет выглядеть следующим образом:

glBindVertexArray(VAOs[2]);

        glBindBuffer(GL_ARRAY_BUFFER, VBOs[2]);
        glBufferData(GL_ARRAY_BUFFER, sizeof(raindrops), raindrops, GL_STATIC_DRAW);

        glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(GLfloat), (GLvoid*)0);
        glEnableVertexAttribArray(0);

        glBindBuffer(GL_ARRAY_BUFFER, VBOs[3]);
        glBufferData(GL_ARRAY_BUFFER, sizeof(translations), translations, GL_STATIC_DRAW);

        glVertexAttribPointer(1, 2, GL_FLOAT, GL_FALSE, sizeof(glm::vec2), (GLvoid*)0);
        glVertexAttribDivisor(1, 6);
        glEnableVertexAttribArray(1);

    glBindVertexArray(0);

Так же я немного не понял вот эту строчку в шейдере:
gl_Position = vec4(aPos + aOffset, 0.0, 1.0);
Разве это не приведёт к ошибкам из-за разницы в размерности векторов? Или это уже я плыву и совсем туплю?

И немного ещё не разобрался с вызовом, для подобной схемы вызов тех самых инстансов может производиться следующим образом?

glUseProgram(shaderProgramForRaindrops);
        glBindVertexArray(VAOs[2]);
        glDrawArraysInstanced(GL_TRIANGLES, 0, 6, 100);
        glBindVertexArray(0);

А насчёт RenderDoc, я, в общем-то, его поставил и вроде как с базовыми механиками подразобрался, но у меня возникло небольшое недопонимание с анализом самого кадра.

Я вижу, что срабатывает отрисовка фигуры, которая и связана с тем самым VAO, который мне нужен и где я бы хотел работать с инстансингом, но при этом отображаются как раз только эти 6 вершин, а сама фигура отрисовывается всего 1 раз по базовым координатам. В чём может быть проблема?

Вершинный шейдер:

//В коде обозначен как const GLchar* vertexRainDrops
#version 460 core\n

layout (location = 0) in vec3 aPos;
layout (location = 1) in vec2 aOffset;

void main()
{
    gl_Position = vec4(aPos + aOffset, 0.0, 1.0);
}

Фрагментный шейдер:

#version 460 core
out vec4 color;
void main()
{
    color = vec4(0.0f, 0.0f, 0.65f, 1.0f);
};

Основной код:

GLuint vertexraindrops = glCreateShader(GL_VERTEX_SHADER);
GLuint fragmentshaderBlue = glCreateShader(GL_FRAGMENT_SHADER);

GLuint shaderProgramForRaindrops = glCreateProgram();

glShaderSource(vertexraindrops, 1, &vertexRainDrops, NULL);
glCompileShader(vertexraindrops);

glShaderSource(fragmentshaderBlue, 1, &fragmentShaderBlue, NULL);
glCompileShader(fragmentshaderBlue);

glAttachShader(shaderProgramForRaindrops, vertexraindrops);
glAttachShader(shaderProgramForRaindrops, fragmentshaderBlue);
glLinkProgram(shaderProgramForRaindrops);

    glm::vec2 translations[100];
    int index = 0;
    float offset = 0.1f;
    for (int y = -10; y < 10; y += 2)
    {
        for (int x = -10; x < 10; x += 2)
        {
            glm::vec2 translation;
            translation.x = (float)x / 10.0f + offset;
            translation.y = (float)y / 10.0f + offset;
            translations[index++] = translation;
        }
    }

    GLfloat raindrops[] = {
        -0.05f, 1.0f, 0.0f,
        -0.05f, 0.95f, 0.0f,
         0.05f, 1.0f, 0.0f,

         0.05f, 1.0f, 0.0f,
         0.05f, 0.95f, 0.0f,
         -0.05f,  1.0f, 0.0f,
    };

    GLuint VBOs[4],
        VAOs[3],
        EBOs[2];

    glGenBuffers(4, VBOs);
    glGenVertexArrays(3, VAOs);
    glGenBuffers(2, EBOs);

/* Здесь объявления VAOs[0] и Vaos[1] */

    glBindVertexArray(VAOs[2]);

        glBindBuffer(GL_ARRAY_BUFFER, VBOs[2]);
        glBufferData(GL_ARRAY_BUFFER, sizeof(raindrops), raindrops, GL_STATIC_DRAW);

        glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(GLfloat), (GLvoid*)0);
        glEnableVertexAttribArray(0);

        glBindBuffer(GL_ARRAY_BUFFER, VBOs[3]);
        glBufferData(GL_ARRAY_BUFFER, sizeof(translations), translations, GL_STATIC_DRAW);

        glVertexAttribPointer(1, 2, GL_FLOAT, GL_FALSE, sizeof(glm::vec2), (GLvoid*)0);
        glVertexAttribDivisor(1, 6);
        glEnableVertexAttribArray(1);

    glBindVertexArray(0);

/* Вызов в игровом цикле*/
        /* Третья программа */
        glUseProgram(shaderProgramForRaindrops);
        glBindVertexArray(VAOs[2]);
        glDrawArraysInstanced(GL_TRIANGLES, 0, 6, 100);
        glBindVertexArray(0);

[Евгений Шатунов]

NimuraF, пошли по порядку. :)

Честно говоря, не совсем понимаю, что из себя представляет этот самый массив из вектор с n=2, загруженный в буфер

Любой буфер - это просто кусок данных. Буферы атрибутов - это буквально типизированные массивы.
GLfloat raindrops[] - тут у тебя закодировано 6 вершин. Ты мог бы сделать и такое объявление: glm::vec3 raindrops[], проинициализировав элементы массива должным образом. Разницы было бы никакой.
glm::vec2 translations[100] можно объявить как GLfloat translations[300] и разницы будет тоже никакой.
С т.з. OGL память translations и память raindrops - это просто память чтобы заполнить буфер. Под вопросом для GPU остается только то, как эту память нужно интерпретировать чтобы получить атрибуты.

Вот на примере того же квадрата, я загружаю в VBO 6 вершин, указываю шаг в 3 элемента (3 координаты) и на основе этого opengl отрисовывает мне пресловутый квадрат.

Это неправильное понимание процессов. Правильным является такое понимание.
GLfloat raindrops[] - это данные буфера позиций вершин примитива на стороне CPU.

glBufferData(GL_ARRAY_BUFFER, sizeof(raindrops), raindrops, GL_STATIC_DRAW);

- переносим данные буфера позиций из памяти CPU в память GPU.

glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(GLfloat), (GLvoid*)0);

- указываем, что каждый атрибут позиции вершины представлен тремя компонентами без нормализации и с типом float в буфере, а смещение между двумя атрибутами в буфере равно 12Б(3 * sizeof(GLfloat) == 12). При этом, базовое смещение внутри буфера до первого атрибута отсутствует.
Т.е. этой функцией производится настройка методики выборки атрибутов из буфера. Этот буфер ты связываешь с нулевым потоком атрибутов шейдера, а в шейдере у тебя что? А в шейдере у тебя layout (location = 0) in vec3 aPos;, т.е. атрибут на три вещественных компонента.

Ровно все то же самое ты проделываешь и для подготовки позиций инстансов, которых тебе хочется сделать 100 штук. Единственное отличие буфера атрибутов примитива от буфера атрибутов инстанса в том, что для буфера атрибутов инстанса надо вызвать glVertexAttribDivisor.

Здесь же я, по сути, делаю то же самое, только aOffset - это какой-то длинный пак данных, в котором я просто указываю шаг через glVertexAttribDivisor(1, 6)?

Тут я ошибся с аргументами, неправильно их вспомнил. Должно быть вот так: glVertexAttribDivisor(1, 1);.
Т.е. за один инстанс обрабатывается один атрибут этого буфера. glVertexAttribDivisor(1, 6); означает что один атрибут обрабатывается за 6 инстансов. Через эту настройку можно управлять группировкой атрибутов между инстансами.
Вызов этой функции - это дополнительная инструкция для методики выборки атрибутов.
glVertexAttribDivisor(1, 1); - выбирать следующий атрибут только для следующего инстанса, а не для следующей вершины.

Так же небольшой нюанс возник с VAO, вот, допустим, я передаю те самые 2 (0 и 1) атрибута, т.е. мой VAO будет выглядеть следующим образом

Тут я не смогу тебя направить. Я не пользуюсь VAO потому что всегда пишу кроссплатформенный код. VAO - это нотация OGL, а в DX, MTL и прочих GAPI этой нотации нет. С этим вопросом тебе стоит разобраться самостоятельно, правильно ли у тебя там все. Внешне, насколько я знаю теорию, у тебя там все правильно.

Так же я немного не понял вот эту строчку в шейдере:

Ты прав, тут несовпадение размерностей. Их надо выровнять. Это я, просто, не сильно старался вычитывать код и кусками его составлял из твоего.
Можно сделать вот так: vec4(aPos.xy + aOffset, 0.0, 1.0);.
Можно так: vec4(aPos + vec3(aOffset, 0.0), 1.0);
Вариантов много. Надо просто выбрать правильный для тебя.

Теперь при инстансинге у тебя выборка атрибутов будет такой: сперва пойдет обработка примитива первого инстанса и начнут перебираться атрибуты нулевого потока. Когда все 6 атрибутов будут выбраны, нулевой поток сбросится на начало, в первом потоке произойдет выборка следующего атрибута и пойдет обработка примитива для следующего инстанса.

И немного ещё не разобрался с вызовом, для подобной схемы вызов тех самых инстансов может производиться следующим образом?

Все верно. Главным является вызов glDrawArraysInstanced. Именно он запускает отрисовку с инстансингом. Все остальное остается как есть, независимо от состояния инстансинга.
Т.е. если до отрисовки с инстансингом у тебя рисовался один примитив, то включение инстансинга, как минимум, не должно сломать это поведение.

А насчёт RenderDoc, я, в общем-то, его поставил и вроде как с базовыми механиками подразобрался, но у меня возникло небольшое недопонимание с анализом самого кадра.

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

[NimuraF]

Евгений Шатунов, прошу прощения, что поблагодарить за помощь смог только сегодня :) В общем-то с отрисовкой при помощи инстансинга разобрался, осталось теперь разобраться, как для каждого представления обрабатывать условия существования)

[Евгений Шатунов]

NimuraF, с решением я всегда рад помочь. :)
По поводу условий существования: ты всегда можешь оформить новый вопрос. Я и все остальные подскажем тебе решение с радостью.