Как реализовать поток игры на основе местоположения в React: OpenStreetMap Map Нажмите на собственную проверку QR-кода I ⇐ Javascript

[Anonymous]

Я разрабатываю образовательное веб -приложение для детей, использующих React и JavaScript. Цель состоит в том, чтобы научить их деревьям решений через формат игры, посвященный экологическим проектам в моем городе (Олденбург, Германия). < /P>
Основной петля геймплея включает в себя эти шаги: < /p>
Вопрос и местоположение: пользователь отвечает на вопрос, связанный с экологической темой. OpenStreetMap (OSM) Карта, встроенная в веб-приложение (например, с использованием библиотеки, такой как реагионный лифт).
Национальный навигационный триггер: пользователь должен иметь возможность щелкнуть маркер на карте OSM. Это действие должно запустить нативное приложение /навигационное приложение на своем смартфоне (например, карты Google или Apple), чтобы предоставить указания в этом конкретном месте.
Grovival & QR-код: как только пользователь физически прибывает в местоположение, он найдет физический QR-код.
In-App Scanning: обратно в веб-приложение, пользователь нажимает кнопку SCAN QR-код ». Это должно активировать камеру устройства из веб -приложения для сканирования QR -кода.
Validation: данные отсканированного QR -кода должны быть подтверждены на соответствии с ожидаемым значением для текущего шага в последовательности «Дерево решений /игры».
Цикл: если QR -код верен, пользователь переходит к следующему шагу вопроса /местоположения. Это продолжается до тех пор, пока они не достигнут конечной точки дерева принятия решений.
(необязательный бонус): в конце концов визуализируйте дерево решений, выделяя путь, взятый. Координаты маркера предварительно заполнены пунктом назначения? Какой лучший подход или схема URL для надежного достижения в различных устройствах (iOS /Android)?
QR-код сканирования и проверка в IOS /Android)? Какие библиотеки JavaScript или API -интерфейсы браузеров (например, API MediaDevices) подходят для доступа к камере и декодированию QR -кодов? Важно отметить, как мне затем взять отсканированные данные и проверить их против ожидаемых данных, связанных с текущим состоянием игры? Любые указатели на управление состоянием игры (текущее местоположение, ожидаемый QR-код) также эффективно будут полезны. /> https://github.com/foifoi13/entbaumidx

Подробнее здесь: https://stackoverflow.com/questions/795 ... p-click-to