Particle Effect Error through Cloud Editor

🧑‍💻 Technical Support
1

Hey 8thwall team, I’m trying to apply particles to my scene and I keep receiving the following error:

Unhandled promise rejection: TypeError: Cannot read properties of undefined (reading ‘generateUUID’)
at new o.Group aframe-particle-system-component-1.1.4.min.js
at n.initParticleSystem aframe-particle-system-component-1.1.4.min.js
at n.update aframe-particle-system-component-1.1.4.min.js
at n.initComponent 8frame-1.4.1.min.js
at n.updateProperties 8frame-1.4.1.min.js
at e.exports.Component 8frame-1.4.1.min.js
at new n 8frame-1.4.1.min.js
at d.initComponent 8frame-1.4.1.min.js
at d.updateComponent 8frame-1.4.1.min.js
at d.updateComponents 8frame-1.4.1.min.js

TypeError: Cannot read properties of undefined (reading ‘generateUUID’)

This is the script tag that i am using:
<script crossorigin="anonymous" src="//cdn.8thwall.com/web/aframe/aframe-particle-system-component-1.1.4.min.js"></script>
along with my particle entity
<a-entity id="particles" particle-system="preset: snow"></a-entity>

I have tried using the aframe-particle-system-component directly instead of the 8thwall cdn, and it still gave me the same error.

Thank you guys in advanced for the help.

2

What version of A-Frame are you using? I believe A-Frame 1.4.1 works well with this version of the particle system.

4

Hey Evan,

I am using A-Frame 1.4.1

<meta name="8thwall:renderer" content="aframe:1.4.1" />
<meta name="8thwall:package" content="@8thwall.xrextras" />
<meta name="8thwall:package" content="@8thwall.landing-page" />

<script
  src="https://streaming.evercoast.com/api/2.0.6/aframe/lib/evercoast-aframe.js"
  crossorigin="anonymous"></script>

<script
  src="https://streaming.evercoast.com/api/2.0.6/aframe/lib/evercoast-aframe-extras.js"
  crossorigin="anonymous"></script>


<script
  crossorigin="anonymous"
  src="//cdn.8thwall.com/web/aframe/aframe-particle-system-component-1.1.4.min.js"></script>

Here is my body.html just in case:

<a-scene
  landing-page
  xrextras-runtime-error
  xrextras-gesture-detector
  xrextras-loading
  renderer="colorManagement: true"
  gltf-model="dracoDecoderPath: https://cdn.8thwall.com/web/aframe/draco-decoder/"
  xrweb="allowedDevices: any">
  <a-assets>
    <a-asset-item id="chair" src="assets/chair.glb"></a-asset-item>
  </a-assets>

  <a-camera
    id="camera"
    position="0 2 3"
    cursor="rayOrigin: mouse"
    raycaster="objects: .cantap"
    cursor="fuse: false; rayOrigin: mouse;">
  </a-camera>

  <a-entity
    light="
      type: directional;
      intensity: 0.8;
      castShadow: true;
      shadowMapHeight:2048;
      shadowMapWidth:2048;
      shadowCameraTop: 10;
      target: #model;
      shadowRadius: 12"
    xrextras-attach="target: model; offset: 1 15 3;"
    shadow>
  </a-entity>

  <a-light type="ambient" intensity="0.7"></a-light>

  <a-entity
    id="parent"
    class="cantap"
    xrextras-one-finger-rotate
    xrextras-pinch-scale
    scale="1 1 1">
    <a-entity id="model" gltf-model="#chair" position="0 0 0" scale="2 2 2" shadow="receive: true">
      <a-entity
        id="asset"
        evercoast-asset="src: https://streaming.evercoast.com/FIU/SamMoore.SamMoore.ec.take.003/3031/SamMoore.SamMoore.ec.take.003.ecm; loop: true;"
        evercoast-asset-controls="float: right"
        position="0 -0.65 -0.1"
        rotation="0 180 0"
        scale="1 1 1">
      </a-entity>
      <a-entity id="particles" particle-system="preset: snow"></a-entity>
    </a-entity>
  </a-entity>

  <a-plane
    id="ground"
    rotation="-90 0 0"
    width="1000"
    height="1000"
    material="shader: shadow"
    shadow>
  </a-plane>
</a-scene>
5

Try this script instead:

<script
  crossorigin="anonymous"
  src="https://cdn.jsdelivr.net/gh/c-frame/aframe-particle-system-component@1.1.4/dist/aframe-particle-system-component.min.js"></script>
6

This topic was automatically closed 4 days after the last reply. New replies are no longer allowed.