https://github.com/alexappi/playcanvas-opti-pixel-examples
https://github.com/alexappi/playcanvas-opti-pixel-examples
Last synced: 18 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/alexappi/playcanvas-opti-pixel-examples
- Owner: AlexAPPi
- Created: 2026-05-02T00:05:22.000Z (about 1 month ago)
- Default Branch: main
- Last Pushed: 2026-05-02T00:49:43.000Z (about 1 month ago)
- Last Synced: 2026-05-02T02:30:13.940Z (about 1 month ago)
- Language: TypeScript
- Size: 9.77 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# OptiPixel – примеры применения технологии отсечения окклюзии
Этот репозиторий содержит демонстрационные сцены и примеры использования OptiPixel для отсечения невидимых объектов в сцене.
Поддерживаются режимы отсечения через HZB и Queries (WebGL2) и indirect draw (WebGPU).
---
## Установка и запуск
1. Клонируйте репозиторий:
```bash
git clone https://github.com/AlexAPPi/playcanvas-opti-pixel-examples
```
2. Установите зависимости:
```bash
npm install
```
3. Настройте расширение VS Code (если нужно):
- Установите рекомендуемое расширение для работы с вашим движком/технологией (например, редактор сцен или редактор скриптов).
- Откройте проект в VS Code и дождитесь завершения индексации.
4. Соберите скрипты и синхронизируйте с редактором:
```bash
npm run build
```
---
## Демонстрационная сцена
1. Создайте новую демонстрационную сцену в вашем редакторе (например, через меню `File → New Scene`).
2. Создайте камеру:
- Добавьте объект камеры в сцену.
- Примените к камере скрипт:
```
OptiPixel:FlyCameraScript
```
- Настройте управление камерой (мышь/клавиатура) по желанию.
3. Добавьте объект:
- Примените к нему скрипт:
```
OptiPixel:OcclusionSystemScript
```
- Данный скрипт генерирует рандомные объекты, для которых будет применена технология тестирования оклюзии.
4. Запустите проект:
- Нажмите кнопку запуска/воспроизведения сцены.
- В режиме воспроизведения можно динамически менять атрибуты скрипта `OptiPixel:OcclusionSystemScript` (например, режим отсечения, пороги, фильтрацию) и наблюдать, как изменяется поведение окклюзии.
---
## Режимы отсечения
В зависимости от целевой платформы поддерживаются разные режимы:
### WebGL2
- **HZB (Hierarchical Z‑Buffer)**
Использует иерархическую Z‑текстуру для отсечения невидимых объектов.
- **Queries (Occlusion Queries)**
Использует аппаратные запросы окклюзии для проверки видимости объектов.
### WebGPU
- **Indirect Draw**
Отсечение реализуется через indirect draw‑вызовы, где только видимые объекты передаются в конвейер рендеринга.
В будущем планируется добавить также поддержку **отсечения через запросы окклюзии** (occlusion queries).
---
## Как экспериментировать
- Меняйте параметры скрипта `OptiPixel:OcclusionSystemScript` в редакторе:
- переключение режима (`HZB`, `Queries`, `IndirectDraw`),
- точность и размеры буферов,
- пороги видимости.
- Перезапускайте сцену или обновляйте режим в реальном времени (если движок поддерживает hot‑reload).
- Сравнивайте производительность и качество отсечения между разными режимами.
---
## Дальнейшее развитие
- Добавление отсечения через **occlusion queries** в WebGPU.
- Оптимизация буферов и уменьшение накладных расходов для мобильных устройств.
- Поддержка авторегулировки параметров окклюзии в зависимости от производительности GPU.
---
## Лицензия
Этот репозиторий распространяется под лицензией `MIT` (см. файл `LICENSE`).