3D Проекція

3 min read

Рендер 3D об’єкти безпосередньо на полотні PinePaper. Система проекції 3D підтримує п’ять типів проекцій, п’ять примітивних форм, рендеринг GPU та орбітальна камера.

Огляд

Система проекції PinePaper 3D є автономною бібліотекою нульової залежності (~18KB minified), яка надає 3D примітиви як 2D полігони на полотні. Об’єкти можна вибрати, перетягувати і анімувати разом з постійними 2D-масивами.

Типи проекції

Виберіть, як об’єкти 3D продаються на 2D полотно:

Проектування Опис
Мета Реальна глибина з передокороченням. Об’єкти, що знаходяться далеко від з’являються меншими. Конфігурація поля зору (FOV).
Ортографічний Немає глибинного спотворення. Паралельні лінії залишаються паралельними. Загальні технічні / інноваційні креслення.
Ізометричний Еквально-кутовий аксонометричний вигляд (30° осей). Популярні в ігровому мистецтві архітектурні схеми.
Шафи Проекція глибинної віссі проводиться на половинному масштабі та 45°.
Кавалє Проекція глибинної осі тягнеться в повному обсязі і 45°.

Примітиви

П’ять вбудованих форм 3D:

Примітивний Опис
Кубок Зручний розмір
Сфера Конфігуративний радіус і кількість сегментів
Циліндр Конфігуративний радіус і висота
Кошик Конфігуративний великий/мінорний радіус
Конус Конфігуративний радіус і висота

Кожен примітив підтримує індивідуальні кольори і обертання на всіх осях.

Прискорення GPU

Рендеринг автоматично вибирає найкращий доступний бекенд:

  1. WebGPU compute — найшвидший, який використовується при наявності
  2. WebGL2 зворотний зв’язок — швидкий зворотний зв’язок
  3. CPU* — універсальний недолік

Прискорення GPU активується автоматично, коли сцена перевищує 150 осіб.

Камери

Орбітальна камера дозволяє контролювати кут огляду:

  • Положення* — де камера знаходиться в 3D-просторі
  • Target* — де знаходиться камера (абобл.)
  • Увімкніть вид* — наявний спосіб спотворення (тільки за допомогою параметра)

Вибір та перетягування об’єктів 3D

3D об’єкти вибирають і перетягують на полотні, як і 2D предмети:

  • Натисніть об’єкт 3D, щоб вибрати його
  • Перетягніть, щоб змінити його
  • Анімація пауза автоматично під час перетягування та відновлення після виходу
  • Перетягна позиція зберігається в рамках анімації

3D Projection Показати шаблон

Передбудований шаблон демонструє систему проекції 3D з декількома примітивами, анімаціями обертання та різними типами проекції. Знайдіть його в бібліотеці шаблону.

Лімітації

  • Standard анімація пресетів (фаде, відмова, прокрутка, пульс тощо) не підтримується на об’єктах 3D. 3D-об’єкти використовують власну анімацію обертання через триD-профлектор. Застосувати стандартну анімацію на об’єкт 3D не буде ефекту.
  • 3D-об’єкти надають як плоскі полігонні наповнювачі — не текстурне покриття, освітлення або тіні.
  • Виявлення між об’єктами 3D ще не доступний.

Навігація

  1. Старт з іометричним* — це найбільш візуально приваблива для діаграм і ілюстрацій
  2. Використання анімацій обертання* — обертів 3D-об’єктів дає сильне відчуття глибини
  3. Combine з 2D предметами — мікс 3D примітивів з текстом та формами для інфографічних композицій
  4. Увімкніть відстань камери* — перемістіть камеру далі для перспективного розміщення, ближче до драматичної глибини

Related: Animations Keyframe Editor Шаблони