Aframe a-entity 模板 > 数据缩略图透明度不起作用

Question

当我进入虚拟模式时，我正在使用带有实体模板的 .png 圆角图像作为数据缩略图...出现带有黑色方框的圆角图像（进一步了解请参见屏幕截图）。

<img id="subway" crossorigin="anonymous" src="images/new/subway.png">
<a-entity id="links" layout="type: line; margin: 2.5" position="-5 4.6 -4">
      <a-entity template="src: #link" data-src="#expense-subway" opacity="0.5" transparent="true" rotation="0 30 0" data-thumb="#subway" class="links"></a-entity>
</a-entity>

Answer 1

当图像应将区域显示为完全不透明而将其他区域显示为完全透明，但在 1%–99% 的透明度之间没有任何东西时，您应该保留默认的 opacity/transparency 值 (opacity: 1.0; transparent: false;)在 material 组件上。这称为 "mask" 或 "cutout" 模式。然后，将 alphaTest 值设置为隐藏图像部分的阈值。您需要根据图像稍微调整一下值，但在这种情况下 alphaTest: 0.25 对我来说看起来很合理。

Aframe a-entity 模板 > 数据缩略图透明度不起作用

Aframe a-entity template > data-thumb transparency not working

javascript

three.js

virtual-reality

aframe