ポインタロックを実装した後にAフレームカーソルのクリックが無効にされる

Question

私のプロジェクトではAフレームを使用しています。クリックすると要素とやりとりすることができるこのカーソルコンポーネントがあります。これはDOMのクリックと非常によく似ています。

ただし、ポインタロックを実装した後は、カーソルのクリックが機能しなくなりました。 ポインタロックは私のためにうまくいきます。私は歩き回って自分のシーンを見回すことができ、カーソルは常に私の目の前に現れます。

クリックが機能しないのはなぜですか？ポインタロックモードに入っていないと、クリックがうまく動作することを確認できます。ありがとう！私のデモへ

リンク： http://zichao.co/exp/_simu/

私は '#floor' にリスナーを追加しています。あなたが正常にフロアをクリックしたら、コンソールは 'こんにちは'と言うべきです。

Answer 1

apiを使用してPointerLockを実装しようとすると、最初に要素を定義し、element.requestPointerLockを呼び出す必要があります。ここの問題はその要素です。

私はa-sceneを要素として取りました。あなたがすべきことは、要素としてキャンバスを取り上げることです。キャンバスは後でフレームでレンダリングされます.3つの.js。

$（document）.ready（）関数はthree.jsによってdomに挿入されるためキャンバスを返すことができません。すなわちcanvasが作成される前にdomが準備完了です。私が今行うことは、インターバルを設定してキャンバスが作成されているかどうかをチェックし、PointerLockをアクティブにすることです。

解決済み。