a-marker タグの id 属性を保存しようとしていますが、コードは正常に動作しますが、JavaScript は最初の a-marker タグのみを認識し、2 番目の a-marker タグは認識しません。
<script>
var place;
AFRAME.registerComponent('markerhandler', {
tick: function () {
if (document.querySelector('a-marker').object3D.visible == true) {
el = document.querySelector('a-marker');
console.log("gogogo");
place = el.getAttribute('id');
console.log(place);
} else {
el = null;
place = null;
}
}
});
</script>
<body style='margin : 0px; overflow: hidden;'>
<a-scene embedded arjs>
<a-marker preset="kanji" id="2">
<a-box position='0 0.5 0' material='opacity: 0.5;' markerhandler>
</a-box>
</a-marker>
<a-marker preset="hiro" id="1">
<a-box position='0 0.5 0' material='opacity: 0.5;' markerhandler>
</a-box>
</a-marker>
</a-scene>
問題のスニペットとコードペンを機能するバージョンに含めました。a-markers の順序を入れ替えると、最初の 1 つだけがコンソールに出力されます。カメラに両方のマーカーを同時に表示していないことを確認するだけです。
これに関する指針は素晴らしいでしょう。
ありがとう。