我模拟spine-canvas的demo加载绘制自己这边的资源，效果是这样的。然后我尝试把demo的资源地址换成我的,也是同样的效果，但这个资源在spine-web-player中却可以正常播放
不知道是不是我忽略了什么配置项，以下是我的主要代码
mounted() {
this.load();
},
methods: {
async load() {
canvas = document.getElementById("canvas");
context = canvas.getContext("2d");
skeletonRenderer = new spine.SkeletonRenderer(context);
skeletonRenderer.debugRendering = true;
skeletonRenderer.premultipliedAlphaBlendModes = false;
skeletonRenderer.premultipliedAlphaColors = true;
console.log(skeletonRenderer)
// Load the assets.
assetManager = new spine.AssetManager("/sketch/");
assetManager.loadText("jibeichen/jibeichen.json");
assetManager.loadTextureAtlas("jibeichen/jibeichen.atlas");
assetManager.loadText("wanwan/wanwan.json");
assetManager.loadTextureAtlas("wanwan/wanwan.atlas");
await assetManager.loadAll();
console.log(assetManager)
// Create the texture atlas and skeleton data.
// Start rendering.
requestAnimationFrame(this.run);
},
loadSkeleton(name,animation,skin){
let atlas = assetManager.require(`${name}/${name}.atlas`);
let json = assetManager.require(`${name}/${name}.json`);
let atlasLoader = new spine.AtlasAttachmentLoader(atlas);
let skeletonJson = new spine.SkeletonJson(atlasLoader);
let skeletonData = skeletonJson.readSkeletonData(json);
// Instantiate a new skeleton based on the atlas and skeleton data.
skeleton = new spine.Skeleton(skeletonData);
skeleton.setSkinByName(skin)
skeleton.setToSetupPose();
skeleton.updateWorldTransform();
bounds = skeleton.getBoundsRect();
// Setup an animation state with a default mix of 0.2 seconds.
var animationStateData = new spine.AnimationStateData(skeleton.data);
// animationStateData.defaultMix = 0.2;
animationState = new spine.AnimationState(animationStateData);
console.log(animationState.setAnimation)
// Set the run animation, looping.
animationState.setAnimation(0, animation, true);
},
run () {
if (assetManager.isLoadingComplete()) {
this.loadSkeleton('jibeichen', 'jbc_010_1', "xizhuang");
requestAnimationFrame(this.render);
} else {
requestAnimationFrame(this.run);
}
},
render() {
// Calculate the delta time between this and the last frame in seconds.
var now = Date.now() / 1000;
var delta = now - lastFrameTime;
lastFrameTime = now;
// Resize the canvas drawing buffer if the canvas CSS width and height changed
// and clear the canvas.
if (canvas.width != canvas.clientWidth || canvas.height != canvas.clientHeight) {
canvas.width = canvas.clientWidth;
canvas.height = canvas.clientHeight;
}
context.clearRect(0, 0, canvas.width, canvas.height);
// Center the skeleton and resize it so it fits inside the canvas.
skeleton.x = canvas.width / 2;
skeleton.y = canvas.height - canvas.height * 0.1;
let scale = canvas.height / bounds.height * 0.8;
skeleton.scaleX = scale;
skeleton.scaleY = -scale;
// Update and apply the animation state, update the skeleton's
// world transforms and render the skeleton.
animationState.update(delta);
animationState.apply(skeleton);
skeleton.updateWorldTransform();
skeletonRenderer.draw(skeleton);
requestAnimationFrame(this.render);
}
},
