Я пытаюсь сделать сцену, где есть «дыра в стене».
Для этого требуется плоскость с удаленным квадратом, а затем примененный к плоскости материал со следующими свойствами:
Есть пример с three.js здесь, но как я могу сделать это с синтаксис материала a-frame?
Глядя на пример коробочка, чтобы создать иллюзию, Ли создает две коробки.
1) Коробка которая "в проруби"
2) Невидимая коробка чуть большего размера без крышки - для маскировки первой. Верхняя часть снимается, чтобы работать как «отверстие», через которое вы можете увидеть первую коробку.
Маскировка достигается за счет того, что второй блок не может отображать какой-либо цвет. Из примера Ли:
let material = new THREE.MeshBasicMaterial({
colorWrite: false;
})
В документы указано, что этот флаг можно использовать для создания невидимых объектов, скрывающих другие.
Боюсь, вы не можете просто сделать материал «плаща» в рамке. Свойство colorWrite
не отображается в компоненте material
.
Я думаю, что самым простым способом будет создание компонента cloak
, который создаст второй блок в THREE.js:
AFRAME.registerComponent('cloak', {
init: function() {
let geometry = new THREE.BoxGeometry(1, 1, 1)
geometry.faces.splice(4, 2) // cut out the top faces
let material = new THREE.MeshBasicMaterial({
colorWrite: false
})
let mesh = new THREE.Mesh(geometry, material)
mesh.scale.set(1.1, 1.1, 1.1)
this.el.object3D.add(mesh)
}
})
и используйте его так:
<a-box material = "src: myPic.png; side: back;" cloak>
Проверьте это в этот код. С маркером HIRO у вас должно получиться вот такое отверстие:
Здесь нам нужно применить магию colorWrite=false
к каждому узлу/потомку модели.
init: function() {
// make sure the model is loaded first
this.el.addEventListener('model-loaded', e=>{
let mesh = this.el.getObject3D('mesh') // grab the mesh
if (mesh === undefined) return; // return if no mesh :(
mesh.traverse(function(node) { // traverse through and apply settings
if (node.isMesh && node.material) { // make sure the element can be a cloak
node.material.colorWrite = false
node.material.needsUpdate = true;
}
});
})
}
Также убедитесь, что плащ отображается перед элементами, которым требуется маскирование:
<a-marker>
<a-entity gltf-model = "#wall-with-a-hole" cloak-component></a-entity>
<!-- the other stuff that needs to be cloaked-->
</a-marker
Привет, я не уверен, чего вы пытаетесь достичь, полезно ли что-нибудь из этого: плащ на сетчатой группе с вырезом лица, плащ на двух объектах включается/выключается каждую секунду
У меня уже есть 3D-модель: <a-entity collada-model = "#myshape"></a-entity>
, и я просто хочу применить к ней материал плаща. Не могу заставить его работать :/
Можете ли вы предоставить глюк или репозиторий git?
Конечно: glitch.com/edit/#!/join/90f266fd-8068-4467-9f91-58838a09aedf Есть модель самолета с "окном", которое я хочу использовать как плащ. Если вы посмотрите в активах, я добавил используемый пользовательский маркер.
Итак, строка 35 - это предмет, который я хочу сделать "плащом".
Я постараюсь проверить это, как только буду дома, ничего, если я сделаю ремикс и немного порежу?
Давайте продолжить обсуждение в чате.
Спасибо, это здорово. Для меня было бы здорово добавить параметр «cloak» к
<a-entity>
и применитьcolorWrite:false
ко всему объекту. Это возможно?