A-frame：如何使用javascript更改图像

更改图像需要什么JavaScript？我不知道如何瞄准他们：

<a-scene stats>
<a-sky src="../1/img/2.jpg"></a-sky>
  <a-assets>
    <img id="my-image" src="../1/img/bear.png" >
    <img id="bear2" src="../1/img/bear.png" >
    <img id="bear3" src="../1/img/bear.png" >
  </a-assets>
  <!-- Using the asset management system. -->
  <a-image src="#my-image" width="10" height="10" position="-5 1 -7" rotation="0 10 0"></a-image>
  <a-image src="#bear2" width="10" height="10" position="5 1 -5" rotation="0 -60 0"></a-image>
  <a-image src="#bear3" width="150" height="150" position="-45 2 100"></a-image>
  <!-- Defining the URL inline. Not recommended but more comfortable for web developers.-->

---

首先，我想使用A-Frame组件来确保加载了相应的元素， 并将src值更改为存储在资产中的任何id，以动态更改图像 通过这样做，假设组件名称为“my image comp”：

AFRAME.registerComponent("my-image-comp", {
  init: function () {
    this.a_image = document.querySelector("a-image");
    setTimeout(() => {
      this.a_image.setAttribute("src", "#my-image-next");
      this.a_image.components.material.flushToDOM(true);
    }, 5000);
  },
});

以下是html，我删除了一些元素以简化：

  <a-assets>
    <img id="my-image" src="../1/img/bear.png" >
    <img id="my-image-next" src="../1/img/bear-next.png" >
  </a-assets>
  <a-image
    my-image-comp
    src="#my-image"
    width="10"
    height="10"
    position="-5 1 -7"
    rotation="0 10 0"
  ></a-image>

这个问题中的“图像”是什么意思？从您的示例代码来看，您似乎只在使用

.obj

几何体文件和

.mtl

材质库文件。更改图像是什么意思？用另一个图像替换图像？要更改哪个图像？我的意思是它可以简单到：document.getElementById（“我的imge”）.src=“/images/some image.png”；因为我正在努力制作运动图像，所以我正在试图找到一种改变图像的方法。如。。。超时{图像更改}

  <a-assets>
    <img id="my-image" src="../1/img/bear.png" >
    <img id="my-image-next" src="../1/img/bear-next.png" >
  </a-assets>
  <a-image
    my-image-comp
    src="#my-image"
    width="10"
    height="10"
    position="-5 1 -7"
    rotation="0 10 0"
  ></a-image>