Not able to render animation with sound
Hello,
I designed an interactive animation, and I am rendering it on a Wordpress website.
I managed to render the animation without audio, but when I render the animation with audio the animation starts and stop immediately, without rendering any audio.
This is the link to the animation in Rive: https://rive.app/community/files/12682-24036-abstract-communication
This is the link of the website where I am rendering the animation: https://kontradiktion.fi/2024/09/sara-sssimone/
And this is the code I have been writing:<div class="sscontainer">
<canvas id="sscanvas" width="700" height="397"></canvas>
</div>
<script src="https://unpkg.com/@rive-app/canvas@2.9.1"></script>
<script>
const r = new rive.Rive({
src: "https://kontradiktion.fi/wp/wp-content/uploads/2024/09/Sara-Sssimone-animation-with-audio.riv",
canvas: document.getElementById("sscanvas"),
autoplay: true,
stateMachines: "State Machine 1",
onLoad: () => {
r.resizeDrawingSurfaceToCanvas();
},
});
</script>
I tried to render the animation on Firefox 130.0 (64-bit) and Google Chrome 128.0.6613.120 (Official Build) (64-bit). I used Rive app v 0.8.1780
Could someone help me to solve the issue?
Thanks a lot,
Sssimone
Hi. Your site is calling an old version of the WASM runtime which does not have support for audio. If you edit this line <script src="https://unpkg.com/@rive-app/canvas@2.9.1"></script>
and replace "2.9.1" with "2.20.0" the audio should work. You can see which runtime versions support each major feature here: https://rive.app/community/doc/feature-support/dockjX9x72UM
Thanks a lot Chad, it works now!