To address your issue with loading files using the Spine Web Player, it seems there might be a few adjustments needed in your code. Here is a revised version of your code snippet:
new spine.SpinePlayer(target.current, {
jsonUrl: 'move.json', // Ensure you are using the correct file extension
atlasUrl: 'move.atlas',
success: function (player) {
console.log("Spine animation loaded successfully");
},
error: function (player, reason) {
console.error("Failed to load Spine animation:", reason);
}
});
Make sure that your move.json and move.atlas files are correctly formatted and accessible from the specified URLs.
1. Obtaining Animation Names
To obtain the animation names, you can access the skeleton instance after the player has successfully loaded. Here is an example:
new spine.SpinePlayer(target.current, {
jsonUrl: 'move.json',
atlasUrl: 'move.atlas',
success: function (player) {
const animations = player.skeleton.data.animations;
animations.forEach(animation => {
console.log(animation.name);
});
},
error: function (player, reason) {
console.error("Failed to load Spine animation:", reason);
}
});
2. Scaling the Animation
To scale the animation, you can directly manipulate the scaleX and scaleY properties of the skeleton. Here is an example:
new spine.SpinePlayer(target.current, {
jsonUrl: 'move.json',
atlasUrl: 'move.atlas',
success: function (player) {
player.skeleton.scaleX = 1.5; // Adjust the scale as needed
player.skeleton.scaleY = 1.5; // Adjust the scale as needed
},
error: function (player, reason) {
console.error("Failed to load Spine animation:", reason);
}
});
Ensure that you replace 'move.json' and 'move.atlas' with the correct paths to your files.
️
