Я новичок в Aframe и столкнулся с одной проблемой, которую не могу решить. Когда у меня загружается Glitch page, камера иногда каким-то образом отключается от головы рига (игрока). Я искал, что может вызвать эту проблему, и я увидел, что это происходит только тогда, когда я добавил дочернюю камеру рендеринга к основной камере (из-за миникарты).
В консоли у меня есть только одно предупреждение:
three.js:3184 THREE.Box3: .getCenter() target is now required
e.getCenter @ three.js:3184
Я использую для второй камеры (мини-карты) этот компонент: https://github.com/jgbarah/aframe-playground/tree/master/camrender-01
Скриншот проблемы: https://imgur.com/a/V8hVKt8
Любые советы или предложения?
Спасибо.
Код:
<a-assets>
<canvas id = "cam2" position = "0 0 0"></canvas>
</a-assets>
<a-entity id = "bodyOfPlayer">
<a-entity
id = "rig"
position = "0 0 0"
rotation = "0 0 0"
movement-controls
gaze-interaction
kinematic-body
>
//this camera I always need to have active because it is main camera of player in first person
<a-entity
id = "headOfPlayer"
camera
position = "0 1.6 0"
rotation = "0 0 0"
look-controls = "pointerLockEnabled:false"
>
<a-sphere class = "head" visible = "true" random-color></a-sphere>
<a-circle position = "-1.2 0.58 -1" rotation = "0 0 0" scale = "0.2 0.2 0.2" width = "0.41" height = "0.41"
material = "src:#cam2; opacity: .95" canvas-updater></a-circle>
<a-image src = "#map" position = "-1.2 0.58 -1" width = "0.53" height = "0.53"></a-image>
<a-entity class = "rayhead" cursor raycaster = "objects: .clickable; showLine: true; far: 500" line = "color: white; opacity: 1" position = "0 0 0" visible = "false"></a-entity>
<a-entity cursor = "fuse: false" geometry = "primitive: ring; radiusInner: 0.02; radiusOuter: 0.03" material = "color: black; shader: flat" position = "0 0 -1"></a-entity>
</a-entity>
//this camera is just for minimap -> not active one, it is view from top on player in fixed canvas on screen
<a-entity camera = "active: false" camrender = "cid: cam2" position = "0 15 0" rotation = "-90 0 0"></a-entity>
</a-entity>
</a-entity>
В основном это происходит из-за того, что A-frame самостоятельно вводит свою камеру во время загрузки. Вы можете проверить это в консоли после добавления всех ресурсов.
document.querySelector('a-scene').camera.el
Если он показывает что-то вроде этого , отличного от камеры, которую мы определили, вам нужно установить активное состояние этой камеры на false. Так наша камера становится активной.
document.querySelector('a-scene').camera.el.setAttribute("camera",{active:false})
РЕДАКТИРОВАТЬ
Либо ваша сцена загружена правильно, либо нет. Дайте предопределенное время в файле JS и запустите это
document.querySelector('a-scene').camera.el.setAttribute("camera",{active:false})
или используйте компонент предварительной загрузки aframe Репозиторий кода и в файле preloader.js измените функцию по умолчанию, подобную этой, после оператора cosole.info «Предварительная загрузка завершена»
triggerPreloadingComplete: function(){
if (this.data.debug){
console.info('Preloading complete');
document.querySelector('a-scene').camera.el.setAttribute("camera",{active:false})}
Это должно решить вашу проблему, то же самое произошло со мной при использовании сетевого фрейма.
Спасибо за ваш ответ. Когда я открываю консоль, я не вижу там камеру с рамкой, если она загружена правильно. Но когда он не загружается должным образом, вмешивается камера, внедренная в кадр, и она там. Проблема в том, что иногда он загружается неправильно, а иногда Aframe сам вставляет камеру.
если в сцене есть камера, a-frame
не должен вводить камеру по умолчанию
Почему-то так бывает. Мне было интересно, если цель getCenter() теперь требуется, предупреждающее сообщение имеет к этому какое-то отношение. Ну, я до сих пор не знаю, что может быть причиной этого.
пожалуйста, проверьте отредактированный ответ. Если вы хотите более четкий ответ, прикрепите код ошибки
если у вас несколько камер, вам нужно иметь разные идентификаторы для каждой, вам нужно установить активный статус камеры в зависимости от того, какую камеру вам нужно использовать
можешь поделиться кодом глюка?
У вас есть Discord или что-то подобное? Я не могу поделиться кодом публично, потому что это частный проект.
Отправить на [email protected]
Вы, вероятно, нажимаете Эта проблема, где теги <template>
или <script>
между <a-scene>
и camera
сущностью мешают предполагаемому поведению.
Это довольно легко воспроизвести:
выше была введена камера по умолчанию, и у вас есть две камеры. Теперь, если вы переместите его вверх:
нет дополнительной камеры. Как предполагалось.
Перемещение камеры вверх — это в значительной степени «обходной путь», вы также можете попробовать выполнить предварительную загрузку, как предложил ajai, или удалить камеру по умолчанию после загрузки сцены (код Diarmid McKenzies из связанной проблемы):
// grab the scene
const sceneEl = document.querySelector('a-scene')
// if the camera id is not matching our camera
if (sceneEl.camera.el.id !== 'headOfPlayer') {
console.info("Deleting unwanted A-Frame default camera")
const wrongCameraEntity = this.el.sceneEl.camera.el;
const cameraEntity = document.getElementById('headOfPlayer');
cameraEntity.setAttribute('camera', 'active', true); // activate our camera
wrongCameraEntity.parentEl.removeChild(wrongCameraEntity); // remove the other one
}
Не уверен, что смогу воспроизвести проблему, можете выложить пример (глюк, рабочий пример), желательно как можно меньше