0

I am attempting to use <a-animate> to change the opacity of a glTF model (invertedsphere9.glb), over time.

I have attempted to add a material component and change its opacity, but have a feeling that what I am doing is creating a new, empty material.

How do I access the material component of my object in order to change opacity?

   <html xmlns="http://www.w3.org/1999/xhtml"><head>
    <meta charset="utf-8" />
    <title>Hello, World! • A-Frame</title>
    <meta name="description" content="Hello, World! • A-Frame" />
    <script src="../../../dist/aframe-master.js"></script>
  </head>
  <body class="a-body "><script type="text/javascript" src="//25.13.175.79:35729/livereload.js?snipver=1" async="" defer="defer"></script><script type="text/javascript" src="//25.13.175.79:35729/livereload.js?snipver=1" async="" defer="defer"></script><script type="text/javascript" src="//25.13.175.79:35729/livereload.js?snipver=1" async="" defer="defer"></script><script type="text/javascript" src="//25.13.175.79:35729/livereload.js?snipver=1" async="" defer="defer"></script><script type="text/javascript" src="//25.13.175.79:35729/livereload.js?snipver=1" async="" defer="defer"></script>
    <a-scene class="fullscreen" inspector="" keyboard-shortcuts="" screenshot="" vr-mode-ui="">
      <a-entity gltf-model="model/invertedsphere.glb" scale="8 8 8"></a-entity>
      <a-entity>
        <a-entity gltf-model="model/invertedsphere9.glb" scale="10 10 10" rotation="0 160 0"></a-entity>
        <a-animation attribute="opacity" from="0" to="100" repeat="indefinite">
      </a-entity>
      <a-entity rotation="0 0 0">
        <a-plane src="model/tex/floor.png" height="10" width="10" rotation="-90 -2 0" material="transparent:true"></a-plane>
        <a-animation attribute="rotation" dur="9900" easing="linear" fill="forwards" to="0 360 0" repeat="indefinite"></a-animation>
      </a-entity>
        <a-plane src="model/tex/aetheria.png" height="1" width="4.25" position="0 2 -4" material="transparent:true"></a-plane>
    </a-scene>
</body></html>
mold
  • 55
  • 11
  • 1
    See: https://stackoverflow.com/questions/43914818/alpha-animation-in-aframe-for-a-object-model, it should be the same for any format here. – Don McCurdy Feb 13 '18 at 21:48
  • @DonMcCurdy I assume that, based on your answer to the question in that link, that this only works with .gltf/.bin files and not with .glb files. Am I correct? – mold Feb 13 '18 at 23:32
  • Once the file has loaded it doesn't matter what format it came from, so `.glb` is fine too. Only exception would be models with customs shaders, but glTF 2.0 cannot currently do that anyway. – Don McCurdy Feb 13 '18 at 23:43

0 Answers0