Технология WebGL используются в интернете для реализации самых разных целей, связанных с 3D графикой. Для облегчения использования WebGL были созданы библиотеки ThreeJS, BabylonJS и некоторые другие. На сегодняшний день библиотека ThreeJS, пожалуй, является наиболее популярной. Она имеет подробную документацию и большое количество рабочих примеров. В интернете имеется огромное количество статей посвященных использованию этой библиотеки. Обычно в этих статьях делается упор на работу с уже готовыми трехмерными моделями предварительно созданных, например, в программах 3ds Max или Blender. В самой библиотеке ThreeJS есть уже предустановленные типы геометрических объектов — плоскость, куб, сфера, тор, которые можно комбинировать и изменять. Однако иногда возникают задачи создания и отображения в браузере параметрических моделей. Параметрическая модель - это модель у которой, в процессе отображения в браузере уже готового объекта, мы можем, однако, изменить его отдельные элементы при помощи задания соответствующих параметров модели. К таким изменениям относятся не только растяжение/сжатие всей модели или отдельных ее частей, но и возможность изменять ее отдельные элементы - увеличить/уменьшать углы наклона граней, изменять размеры отдельных элементов модели и производить другие локальные и глобальные изменения модели. Причем необходимо производить такие изменения в реальном времени и интерактивно.
Для решения этих задач нам потребуется набор функций на языке Javascript, которые будут реализовывать методы применяемые в аналитической геометрии. В соответствующей библиотеке должны присутствовать функции для создания прямых, плоскостей и окружностей, нахождения точек (или прямых) пересечения их между собой, создания наклонных плоскостей и многое другое. В библиотеках ThreeJS и BadylonJS некоторые из этих возможностей присутствуют, но количество осуществляемых с помощью них действий не позволит выполнить все возникающие задачи при построении параметрической модели. Существуют еще несколько чисто математических Javascript библиотек. Из них наиболее широкое распространение получили glMatrix и Sylvester. Библиотека glMatrix в основном предназначена для работы с векторами, матрицами и кватернионами, но функций для работы с прямыми и плоскостями в ней нет. В библиотеке Sylvester подобные функции есть, но присутствуют они в достаточно ограниченном количестве.
Язык C/C++ уже стал практически стандартом для создания программ трехмерной геометрии. Но напрямую в браузере его использовать невозможно. Однако можно взять за основу существующие библиотеки геометрических функций на C/C++ и на их основе создать соответствующую Javascript библиотеку. Использованная для создания моделей библиотека WebGeometry на языке JavaScript была сделана именно таким образом. Как выглядят подобные библиотеки на C/C++ можно увидеть в книге Eric Lengyel "Foundations of Game Engine Development, Volume 1: Mathematics" или в более ранних книгах этого автора. На русском языке есть небольшая, но на мой взгляд очень хорошая, книга выпущенная еще в 1984 году Й.Энджел "Практическое введение в машинную графику". В ней приведены на Фортране основные программы 2D и 3D-графики. Эта книга есть в интернете.
Фактически все представленные главы этой работы представляют набор примеров объясняющих как можно расчитывать с помощью функций входящих в состав библиотека WebGeometry сложные многогранники и отображать их при помощи ThreeJS в браузере. Библиотека ThreeJS используется для вывода на экран уже рассчитанных моделей — для расчета формы моделей она не используется. Но возможности ThreeJS позволяют сделать процесс отображения полностью интерактивным - вплоть до просмотра координат каждой точки принадлежащей модели, наклоны и азимуты граней модели, названия граней и отображение номеров вершин модели (а таких вершин может быть гораздо больше 100).
Очень часто для иллюстрации геометрических построений на экране компьютера берутся платоновы или архимедовы тела, которые являются многогранниками. Их можно увидеть, например на следующем сайте. Однако, для отображения на указанном сайте многогранников используются уже заранее расчитанные координаты вершин. Для моделей многогранников имеющих однородную (регулярную) структуру существуют уже готовые формулы и способы расчета координат вершин. Однородными называются те многогранники, все грани которых - правильные многоугольники и, кроме того, все многогранные углы которых равны. Иначе говоря, в однородных многогранниках каждую вершину окружают правильные многоугольники в одном и том же порядке. Для их расчета используется красивая и одновременно достаточно сложная (Coxeter H.S.M. "Regular Polytopes") но уже устоявшаяся математика.
Для создания моделей многогранников не имеющих полностью однородную структуру приходится делать самые разнообразные вычисления используя стандартную аналитическую геометрию. Поэтому в качестве примеров многогранников были взяты огранки драгоценных и поделочных камней. Их грани обычно не представляют собой правильные многоугольники. Но они красивы, обладают симметрией и при этом не являются полностью регулярными - положение граней и вершин приходится всегда определять используя каждый раз новые способы их расчета. Так как создаются эти многогранники строго по правилам геометрии и не допускают отступлений от этих правил, то расчет положения их вершин хорошо подходит для иллюстрации использования функций библиотеки WebGeometry и последующего отображения при помощи ThreeJS.
В каждой главе присутствует хотя бы одна полностью законченная
программа. Для понимания этих программ необходимо иметь некоторый опыт работы
с Javascript, хотя в этих программах используются самые простые конструкции языка.
Чуть более пристальное внимание следует обратить на обработку событий с
использованием Javascript.
Для знакомства с ThreeJS можно рекомендовать второе издание книги Хуана Диего Гоше
"HTML5 Для профессионалов" перевод которой вышел в 2015 году в издательстве "Питер".
В главе 11 этой книги очень кратко, но в то же время доходчиво рассмотрены все основные
элементы ThreeJS - рендерер, сцена, камера, материалы и др.
При построении многогранников не рассматривается вопрос о том как создается
каркас программ с использованием библиотеки ThreeJS и работа ее стандартных функций.
Только в главах 1 и 2 разобраны некоторые моменты касающиеся ThreeJS.
Иногда требуется при расчетах моделей многогранников произвести некоторые поясняющие построения на плоскости. Для таких построений используется 2D-холст HTML5 canvas. В некоторых главах будут созданы полностью интерактивные 2D-чертежи отдельных элементов многогранников. С этой целью был разработан небольшой набор элементов для построения таких чертежей. Каждый чертеж представляет собой специально масштабированный и подогнанный (как в программах CAD/CAM) холст на который наносятся размеры, углы и т.д.
В главе 10 упомянутой ранее книги "HTML5 Для профессионалов"рассмотрен API Canvas, функции которого используются для построения интерактивных 2D-чертежей некоторых элементов моделей.
Желательно также посмотреть некоторые книги по аналитической геометрии и линейной алгебре. При создании библиотеки WebGeometry в основном использовались две книги по геометрии. Это "Курс аналитической геометрии" Н.И. Мусхелишвили, который был выпущен несколькими изданиями и "Краткий курс аналитической геометрии" Н.В. Ефимов - было выпущено очень много изданий этой книги. По линейной алгебре можно взять любую книгу, где хорошо разобрано использование матриц. К сожалению я не нашел книг на русском языке в которых аналитическая геометрия была бы изложена на языке линейной алгебры доступным и не использующим абстрактные математические конструкции образом. На английском языке такая книга существует - "Practical Linear Algebra. A Geometry Toolbox". Ее авторы - Gerald Farin и Dianne Hansford.
Все тексты программ я старался делать как можно проще. Так же не пытался специально ускорить выполнение программ за счет их оптимизации и сокращения, для того чтобы не потерялась ясность используемых методов построения моделей.
Набрав в поисковике google два слова "polyhedron webgl" можно увидеть множество сайтов на которых показано как создавать правильные, полуправильные и звездчатые многогрвнники для их отображения в браузере. Но найти методику построения в браузере произвольного и к тому же сложного многогранника без предварительно расчитанных координат вершин мне не удалось. Поэтому надеюсь, что моя работа будет полезна всем кто использует геометрию при построении параметрически настраиваемых 3D-моделей в самых различных областях и не только при создании моделей многогранников, но и при конструировании моделей других объектов.