javascript - 来自 Javascript 的双面 a-frame a-panel

标签 javascript dom aframe

如何从 Javascript 设置 a-frame a-panel 的 Material ,以便纹理变为双面?

我已经成功地从外部 Javascript 做到了这一点 <a-plane src="image.jpg" material="side: double">但我无法让它与 JavaScript 一起工作。

这是一个非工作示例,其中仅正面可见:

<html>
<head>
    <script src="aframe.min.js"></script>
    <script type="text/javascript">
     function setup() {
       scene = document.querySelector('a-scene');

       var entity = document.createElement('a-entity');
       entity.setAttribute('position', '0 1.6 -1');

       var plane = document.createElement('a-plane');
       var planeMaterial = document.createElement('material');
       planeMaterial.setAttribute('side', 'double');
       plane.appendChild(planeMaterial);
       plane.setAttribute('src', 'https://upload.wikimedia.org/wikipedia/commons/thumb/3/30/Jubilee_and_Munin%2C_Ravens%2C_Tower_of_London_2016-04-30.jpg/240px-Jubilee_and_Munin%2C_Ravens%2C_Tower_of_London_2016-04-30.jpg')
       entity.appendChild(plane);

       scene.appendChild(entity);
     }
     window.onload = setup;
    </script>
</head>

<body>
    <a-scene></a-scene>
</body>
</html>

最佳答案

根据您提供的 html,这就是您所需要的。

plane.setAttribute('material','side:double');

您发布的代码会生成

<a-plane src="image.jpg"><material side="double"></material></a-plane>

<小时/>

function setup() {
  scene = document.querySelector('a-scene');

  var entity = document.createElement('a-entity');
  entity.setAttribute('position', '0 1.6 -1');

  var plane = document.createElement('a-plane');
  plane.setAttribute('material', 'side: double;');
  plane.setAttribute('src', 'https://upload.wikimedia.org/wikipedia/commons/thumb/3/30/Jubilee_and_Munin%2C_Ravens%2C_Tower_of_London_2016-04-30.jpg/240px-Jubilee_and_Munin%2C_Ravens%2C_Tower_of_London_2016-04-30.jpg')
  entity.appendChild(plane);

  scene.appendChild(entity);
}
window.onload = setup;
<html>

<head>
  <script src="https://aframe.io/releases/0.7.0/aframe.min.js"></script>
</head>

<body>
  <a-scene></a-scene>
</body>

</html>

关于javascript - 来自 Javascript 的双面 a-frame a-panel,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46503982/

相关文章:

javascript - jQuery .filter 使用 .css(display) 但不使用 .css(background-color)

javascript - 如何处理 brng.toRad 不是函数

javascript - 在遍历 DOM 树时确定元素是 block 级还是与 JavaScript 内联

javascript - 设置名称与 XML 的名称生产不匹配的 DOM 元素的属性

javascript - 如何使用 Javascript (jQuery) 确定 'line-height'?

javascript - A 帧淡出基元

javascript 两种颜色重复效果

javascript - GoJS 从 TextBlock 点击处理程序获取父节点

javascript - a 帧屏幕截图仅适用于基元

socket.io - 框架中出现蓝屏