Привет, друзья!
Еще недавно управление содержимым веб-страницы с помощью жестов можно было наблюдать разве что в фантастических фильмах. Сегодня все, что для этого требуется - видеокамера и браузер (и библиотека от Google).
В данном туториале мы рассмотрим 5 примеров:
- получение данных с видеокамеры и их отрисовка на холсте (canvas);
- обнаружение и отслеживание кисти руки;
- управление "курсором" с помощью указательного пальца;
- определение жеста "щипок" (pinch);
- нажатие кнопки с помощью щипка.
Все примеры будут реализованы на чистом JavaScript.
Источником вдохновения для меня послужила эта замечательная статья.
Для обнаружения и отслеживания руки и жестов будет использоваться MediaPipe. Для работы с зависимостями - Yarn.