Пример для начинающих в компьютерной графике на WebGL и TypeScript

Запись от 8Observer8 размещена 07.10.2019 в 15:22

Показов 2069 Комментарии 0

Метки typescript, webgl

Содержание блога

Написал пример для начинающих в WebGL на TypeScript. Пример рисует треугольник: https://plnkr.co/edit/PkqSZGwh... ?p=preview

Если есть желание изучать геометрию, линейную алгебру, компьютерную графику, то пожалуйста: делайте Fork, изменяйте, сохраняйте, показывайте своё творчество друзьям.

Отмечу, что размер, положение и угол поворота треугольника задаётся в файле ShaderProgram в виде, соответственно: матрицы масштабирования, матрицы поворота, и матрицы переноса:

JavaScript
1
2
3
4
5
6
7
let modelMatrix = mat4.create();
mat4.translate(modelMatrix, modelMatrix, vec3.fromValues(0, 0.5, 0));
mat4.rotateZ(modelMatrix, modelMatrix, 20.0 * Math.PI / 180.0);
mat4.scale(modelMatrix, modelMatrix, vec3.fromValues(0.5, 0.5, 1));
 
let u_ModelMatrix = gl.getUniformLocation(this.program, "u_ModelMatrix");
gl.uniformMatrix4fv(u_ModelMatrix, false, modelMatrix);

Я использую библиотеку glMatrix для работы с матрицами и векторами: http://glmatrix.net/

Рекомендую книгу на русском: WebGL. Программирование трехмерной графики https://www.ozon.ru/context/detail/id/31239396/
Либо её оригинал на английском: WebGL Programming Guide https://sites.google.com/site/webglbook/

Метки typescript, webgl

Размещено в Без категории

« Инструкция. Добавляем OpenGL графику на WPF форму с помощью OpenTK.GLControl Главная страница Книги по математике в компьютерной графике для начинающих »

Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.

8Observer8 8Observer8 вне форума

Регистрация 05.10.2013
Адрес Саратов
Сообщений 8,103
Записей в блоге 243

Новые блоги и статьи Все статьи Все блоги /
Саморегулирующийся социальный контракт для сервера cross-section. Hrethgir 14.08.2026 С кодом конечно таких глубоких размышлений пока не было, впрочем я уже привык к алгоритмизации. Суть предмета записи: снова в диалоге с нейросетью (я взял пока себе ник для учётки админа - Rector). . . .	Часы электронные Uhbif79 12.08.2026 Выкладываю программу часов. Программа позволяет: 1. Использовать системное время и дату, 2. Есть возможность вводить время и дату вручную. 3. Реализованы 2 будильника: начало и конец рабочего дня. . . .	Часы с будильником на основе класса QLCDNumber Uhbif79 12.08.2026 Всем добрый день, выкладываю программу часов с будильником на основе класса QLCDNumber. Здесь я пробовал самостоятельно создавал классы, впервые столкнулся с видимостью переменной одного класса из. . .	Установка MinGW GCC 16.2 и CMake 8Observer8 10.08.2026 VK Видео: https:/ / vkvideo. ru/ video-240781534_456239017 YouTube: eY5-5PyI9NM Текстовая версия
Неделя из жизни имитационной модели склада: мои кривые руки растут, откуда надо anaschu 10.08.2026 Неделя из жизни имитационной модели склада: как я почти написал неправильную логику и что с этим делать Работаю сейчас над учебно-рабочим проектом: строю в AnyLogic имитационную модель процессов. . .	Калькулятор для расчета родства russiannick 07.08.2026 1. Задача: Создать калькулятор для расчета родства. Родственных связей существует 8 ступеней, такие как: p - отец P - мать q - муж Q - жена b - брат B - сестра s - сын S - дочь	Мир по моей воле kumehtar 07.08.2026 Когда-то кажется, что всё просто. Ты весь такой светлый. Причиняешь добро. Борешься за справедливость в этом тёмном мире. Потом начинаешь замечать одну неприятную вещь. Почти каждый хороший. . .	Кредитный калькулятор Maks 05.08.2026 Решение задачи по прикладной информатике средствами 1С. Задача: Напишите приложение-калькулятор, которое помогает рассчитывать параметры кредита для аннуитетного и дифференцированного видов. . .

Наверх

Сообщение форума

Отменить изменения