<script src="https://unpkg.com/@bitjson/qr-code@1.0.2/dist/qr-code.js"></script>

<button style="margin: auto;" onclick="play()">play</button>

<qr-code id="qr1" contents="https://blog.bitjson.com/cashtokens-v2/" module-color="#1c7d43" position-ring-color="#13532d" position-center-color="#70c559" style="
          width: 150px;
          height: 150px;
          margin-left: auto;
          margin-right: auto;
          background-color: #fff;
        ">
  <img src="https://qr.bitjson.com/src/assets/bch.svg" slot="icon" />
</qr-code>
<script>
  document.getElementById('qr1').addEventListener('codeRendered', () => {
    document.getElementById('qr1').animateQRCode('MaterializeIn');
  });
</script>

function play() {
  document
    .getElementById("qr1")
    .animateQRCode((targets, _x, _y, _count, entity) => ({
      targets,
      from: entity === "module" ? Math.random() * 1000 : 500,
      duration: 1000,
      web: {
        opacity: entity === "module" ? [0, 0.5, 0, 1] : [0, 1]
      }
    }));
}