Я работаю над игровым механизмом c в игре VR, где пользователь должен использовать два внутриигровых джойстика для управления машиной (один вверх / вниз, один влево / вправо). Я лишь немного знаком с Cannon JS с точки зрения столкновений; Я использую компонент, который его обертывает (https://github.com/donmccurdy/aframe-physics-system), но я просто не могу понять, как физическое ограничение должно работать для этого приложения.
В настоящее время есть «подиум» с панелью под углом 45 *, из которой торчат два джойстика. 
Прямо сейчас джойстики настроены с базовым c шарнирным ограничением:
constraint="target: #joystickpanel; type: hinge; axis: 0 1 0; targetAxis: 0 1 0; targetPivot: 0.125 0 0;" (length of joystick is 0.25)
Они дрожат в режиме ожидания. Вы можете схватить их и перемещать вверх / вниз / из стороны в сторону, и они вроде как нормально реагируют, но если вы их поверните, они go немного сумасшедшие, и вы должны позволить go позволить им вернуться в положение. Вы можете увидеть небольшой пример видео здесь в 0:08. Я пробовал различные настройки и типы ограничений, но я просто не понимаю, как именно это работает. c или нет?
Я все еще хотел бы знать, как это правильно реализовать, но в итоге я реализовал это хакерским способом, как вы можете видеть в этом видео: https://www.youtube.com/watch?v=5XX3Lb0AnxY
<a-box id="joystickpanel" static-body position="0 1 9.59" rotation="-45 0 0" depth="0.3" width="0.85" height="0.001" color="#595959"></a-box>
<a-cylinder joymove id="joystickleft" constraint="target: #joystickpanel; type: hinge; axis: 0 1 0; targetAxis: 0 1 0; targetPivot: 0 0.1 0;" dynamic-body="shape: cylinder;" class="grabbable" position="0 1.01 9.59" radius="0.01" rotation="-45 0 0" height="0.25" color="#FFFFFF">
<a-sphere static-body position="0 0.15 0" radius="0.03" color="red"></a-sphere>
</a-cylinder>