ABUKSIGUN

В двух предыдущих статьях мы разобрались со многими вещами. И вот на очереди текстуры. Статья должна быть простой, по сравнению с предыдущей. Мы добавим пару строчек в шейдер и одну функцию для загрузки текстуры, так же увеличим количество вершин объекта, что бы получился куб.

В предыдущей части туториала я описывал простейший случай рисования в WebGL. Теперь мы немного усложним имеющийся код. Изменения коснутся шейдеров, мы научимся передавать в них произвольные данные. Наконец появится пару строчек на тему алгебры. Нам придется задействовать матричные преобразования, чтобы говорить о 3D в привычном понимании. Вкратце, в конце туториала мы получим квадрат раскрашенный градиентным кружочком, который будет поворачиваться вслед за курсором. Полный код примера тут .

Не так давно, я решил заменить отрисовку средствами canvas на WebGL в своем небольшом проекте. Первой ссылкой в гугле выпал этот замечательный туториал http://learningwebgl.com/blog/?page_id=1217 . Разобравшись с интересующими меня уроками пришел к выводу, что примеры к этим урокам можно значительно упростить, а некоторые понятия требуют иллюстраций. Решил написать небольшую заметку о том как нарисовать квадрат и затем текстурировать его средствами WebGL. Полный код примера тут