<xr-scene ar-system="modes:Marker" bind:ready="handleReady">
  <xr-assets bind:loaded="handleAssetsLoaded">
    <xr-asset-load type="gltf" asset-id="cool-star" src="https://mmbizwxaminiprogram-1258344707.cos.ap-guangzhou.myqcloud.com/xr-frame/demo/cool-star.glb" />
    <xr-asset-load type="keyframe" asset-id="anim" src="./test.json" />
  </xr-assets>

  <xr-env env-data="xr-frame-team-workspace-day" />
  <xr-light type="ambient" color="1 1 1" intensity="1" />
  <xr-light type="directional" rotation="40 70 0" color="1 1 1" intensity="3" cast-shadow />
  
  <xr-node wx:if="{{loaded}}">
    <xr-ar-tracker
      mode="Marker" bind:ar-tracker-switch="handleTrackerSwitch"
      src="./images/logo.jpg"
    >
      <xr-node anim-keyframe="anim" anim-autoplay="clip:one">
          <xr-gltf model="cool-star" anim-autoplay />
      </xr-node>
    </xr-ar-tracker>
  </xr-node>

  <xr-camera clear-color="0.4 0.8 0.6 1" background="ar" is-ar-camera />
</xr-scene>

{
  "keyframe": {
    "one": {
      "0": {
        "position": [0, 0, 0],
      },
      "50": {
        "position": [-10, 10, 0]
      },
      "100": {
        "position": [-20, 20, 0]
      }
    }
  },
  "animation": {
    "one": {
      "keyframe": "one",
      "duration": 2,
      "ease": "ease-in-out",
      "loop": -1
    }
  }
}