WebGL и сила двух размеров изображения

Question

Я хочу использовать WebGL, чтобы создать небольшую 3D галерею фотопотоков Flickr. Похоже, что WebGL позволяет использовать только квадратные изображения, размеры которых являются степенью двойки, в качестве текстур. Мне нужно иметь возможность отображать изображения любой пропорции и размера. Я вижу, что если я скопирую данные изображения в другое изображение, которое является ближайшим квадратным измерением, а затем использую координаты текстуры, чтобы заставить его отображаться правильно. Проблема в том, и исправьте меня, если я ошибаюсь, что я не могу выполнить эту манипуляцию изображения в JavaScript, и мне понадобится сервер под управлением ASP.NET, Java или что-то в этом роде, чтобы выполнить обработку для меня, прежде чем WebGL сможет добраться до меня на нем.

Есть ли способ использовать изображения произвольного размера в WebGL и JavaScript без необходимости использования сервера в качестве процессора изображений среднего уровня?

Answer 1

У меня нет проблем с текстурами npot (FF и chrome) при условии, что вы выполните:

texParameteri(TEXTURE_2D, TEXTURE_MAG_FILTER, LINEAR);
texParameteri(TEXTURE_2D, TEXTURE_MIN_FILTER, LINEAR);
texParameteri(TEXTURE_2D, TEXTURE_WRAP_S, CLAMP_TO_EDGE);
texParameteri(TEXTURE_2D, TEXTURE_WRAP_T, CLAMP_TO_EDGE);

Answer 2

Эта страница хорошо подводит итог ситуации (и более или менее повторяет то, что уже сказали другие респонденты). По сути, WebGL не поддерживает текстуры NPOT с отображением и / или повторениями. И если вы не можете обойтись без этих режимов, текстуру можно изменить в 2D-холсте. И страница содержит некоторый удобный код для изменения размера холста.

Обновление: WebGL2, следующая версия WebGL, поддерживает текстуры NPOT .

Answer 3

Простым решением было бы изменить размер с помощью 2d canvas и использовать его в качестве текстуры.

Answer 4

Я не очень хорошо понимаю детали низкого уровня, чтобы полностью ответить на ваш вопрос, но вот некоторые вещи, которые я нашел:

Этот пост не внушает оптимизма:

В Minefield обновлена ​​обработка текстур, чтобы [она] лучше соответствовала спецификации;ранее это было [...] довольно простительно и позволяло вам использовать текстуры, которые не были действительно действительными с точки зрения WebGL.Теперь он не [...] увидит сообщение об ошибке, говорящее: «Текстура будет отображаться, как если бы она была черной, в соответствии с разделом 3.8.2 спецификации OpenGL ES 2.0.24, потому что это2D-текстура с минимизацией фильтра, для которой не требуется mipmap, с шириной или высотой, не равной двум, и режимом обтекания, отличным от CLAMP_TO_EDGE. ”

Я не знаю, если эти дополнительныеусловия применяются к вашему приложению.См. Также OpenGL ES spec .

Этот поток достаточно подробно описывает поддержку "NPOT":

OpenGL поддерживает текстуры NPOT двумя способами.Первый называется «Прямоугольные текстуры» (RT), который может быть любого размера, но не может быть повторяющимся, отображаться в mip или иметь границы.И вместо того, чтобы использовать 0-1 текстурные координаты, они используют 0-w, 0-h.OpenGL также поддерживает настоящие текстуры NPOT, которые имеют ограничения, аналогичные RT, но которые используют нормальные координаты текстуры 0-1.

Проблема в том, что некоторые старые устройства (а когда я говорю «более старые», я имею в виду оборудование от2005) поддерживает только RT, а не правда NPOT.Невозможно эмулировать NPOT, когда у вас есть только поддержка RT, потому что в GLSL вы используете другой сэмплер для RT (sampler2DRect vs sampler2D).

OpenGL ES поддерживает только NPOT, а не RT.

...

Реализация WebGL может масштабировать данные текстуры NPOT до следующей наивысшей степени двух измерений во время texImage2D и texSubImage2Dзвонки.Это не повлечет за собой никаких изменений API.O3D делает это в некоторых случаях как доказательство того, что техника может работать без ведома конечного пользователя.Я думаю, что было бы плохой идеей выставлять прямоугольные текстуры в API WebGL;они определенно не путь вперед.

Итак, возьми этот FWIW ...

Answer 5

Справка, предоставленная @EnabrenTane, очень полезна. Поддержка не-двух текстур

В то время как OpenGL 2.0 и более поздние версии для настольных компьютеров предлагают полную поддержку текстур не-двух (NPOT), OpenGL ES 2.0 иУ WebGL ограниченная поддержка NPOT.Ограничения определены в разделах 3.8.2 «Выполнение шейдеров» и 3.7.11 «Генерация Mipmap» спецификации OpenGL ES 2.0 и приведены здесь:

• generateMipmap (target)генерирует ошибку INVALID_OPERATION, если изображение уровня 0 текстуры, в настоящее время привязанной к цели, имеет ширину или высоту NPOT.
• Выборка текстуры NPOT в шейдере даст цвет RGBA (0, 0, 0, 1), если:
  • Фильтр минимизации установлен на что угодно, кроме NEAREST или LINEAR: другими словами, если он использует один из фильтров mipmapped.
  • Режим повтора установлен на что угодно, кроме CLAMP_TO_EDGE;повторяющиеся текстуры NPOT не поддерживаются.