Immediate rendering: drawLine, drawWireBox

PlayCanvas предоставляет мощные инструменты для создания интерактивных 3D-приложений, включая возможность рисовать элементы непосредственно на экране с использованием методов немедленного рендеринга. Эти методы позволяют создавать графику в реальном времени без необходимости предварительного создания геометрии или сложных объектов. В этой главе рассмотрены два ключевых метода: drawLine и drawWireBox.

Метод drawLine

Метод drawLine используется для рисования линии между двумя точками в трехмерном пространстве. Это один из простейших способов визуализировать линии в 3D-приложении, например, для отображения направлений, сетки или соединения объектов.

Синтаксис
drawLine(start, end, color, width);
  • start — начальная точка линии, представляется как вектор с тремя компонентами: [x, y, z].
  • end — конечная точка линии, также вектор с компонентами [x, y, z].
  • color — цвет линии, задается в формате [r, g, b, a], где значения компонентов находятся в диапазоне от 0 до 1 (красный, зеленый, синий и альфа-канал для прозрачности).
  • width — толщина линии, принимает значения от 1 до 10, где 1 — минимальная толщина, а 10 — максимальная.
Пример использования
var lineStart = new pc.Vec3(0, 0, 0);
var lineEnd = new pc.Vec3(10, 0, 0);
var lineColor = new pc.Color(1, 0, 0);  // Красный цвет
var lineWidth = 2;

app.graphics.drawLine(lineStart, lineEnd, lineColor, lineWidth);

Этот код рисует красную линию от точки (0, 0, 0) до точки (10, 0, 0) с толщиной 2. Метод drawLine часто используется в сценариях, когда требуется простое отображение связей между точками или объектов.

Метод drawWireBox

Метод drawWireBox предназначен для рисования невидимой (wireframe) коробки, состоящей из линий, соединяющих восемь вершин прямоугольного параллелепипеда. Это полезный инструмент для визуализации ограничивающих объемов, объектов или маршрутов в 3D-пространстве.

Синтаксис
drawWireBox(min, max, color, width);
  • min — вектор, представляющий минимальные координаты коробки, то есть одну из её угловых точек: [x_min, y_min, z_min].
  • max — вектор, представляющий максимальные координаты коробки, противоположную точку: [x_max, y_max, z_max].
  • color — цвет коробки, задается в формате [r, g, b, a], где компоненты находятся в диапазоне от 0 до 1.
  • width — толщина линий, которая соединяет вершины коробки, диапазон значений от 1 до 10.
Пример использования
var boxMin = new pc.Vec3(-5, -5, -5);
var boxMax = new pc.Vec3(5, 5, 5);
var boxColor = new pc.Color(0, 1, 0);  // Зеленый цвет
var boxWidth = 3;

app.graphics.drawWireBox(boxMin, boxMax, boxColor, boxWidth);

Этот код рисует коробку с вершинами в пределах от (-5, -5, -5) до (5, 5, 5) зеленого цвета и толщиной линий 3. Метод drawWireBox часто применяется для представления объемов в сценах, например, для визуализации области видимости камеры, границ объектов или области действия каких-либо эффектов.

Основные особенности и преимущества

  • Производительность: Методы немедленного рендеринга не требуют сложных предварительных вычислений и загрузки ресурсов, что позволяет сэкономить время при рисовании динамических объектов, таких как линии или ограничивающие коробки. Однако они не подходят для сложных объектов с большим количеством полигонов, так как эти методы не оптимизированы для работы с большим объемом данных.

  • Гибкость: Возможность изменять цвет и толщину линий позволяет динамически адаптировать визуализацию. Например, можно изменять толщину линий в зависимости от расстояния от камеры или других факторов.

  • Отсутствие геометрии: Поскольку эти методы не создают полноценные 3D-объекты, они идеальны для задач, где важно лишь отобразить связи или границы, а не создавать сложные меши или материалы.

Использование в реальных приложениях

Методы drawLine и drawWireBox могут быть полезны в различных сценариях:

  1. Отладка: Для отображения ограничивающих объемов объектов, что позволяет разработчикам быстро выявлять проблемы с пересечениями или масштабом.
  2. Рендеринг сетки: Для визуализации сетки или направлений в пространстве, как например, в играх или приложениях с физическими симуляциями.
  3. Обозначение границ: В приложениях, где нужно отображать области действия камеры или другого объекта, методы немедленного рендеринга обеспечивают быстрый и эффективный способ визуализации.

Ограничения

  • Не подходит для сложной геометрии: Хотя эти методы и удобны для простых объектов, для более сложных объектов с множеством полигонов предпочтительнее использовать более традиционные методы рендеринга с подготовленными мешами.
  • Отсутствие текстур и освещения: Линии и коробки, рисуемые с помощью этих методов, не поддерживают текстуры и эффекты освещения, что делает их менее подходящими для визуализаций, требующих детализированной графики.

Заключение

Методы drawLine и drawWireBox являются мощными инструментами для немедленного рендеринга простых геометрических форм в PlayCanvas. Эти методы идеально подходят для задач, где нужно быстро и эффективно визуализировать линии и ограничивающие объемы, без создания сложных объектов или применения материалов.