Question

我正在使用Animate作为资产生成器来构建游戏，并使用StageGL处理对象。我所有的对象都是存储在Animate生成的主Spritesheet中的SPOT位图纹理。

如果我尝试创建一个新的位图以手动编码其中一个精灵的效果（我想使用sourceRect将位图拆分为片段，然后“溶解”），则我会遇到跨域错误-尽管事实我正在通过Webpack开发服务器（即localhost：3000）运行该站点，并且sprite可以在其他位置正常加载（例如，如果我只是在舞台上添加已经包含位图的MovieClip）。

var srcImg = new lib.MySourceImage(); //This is the Sprite in the Animate library
var bmp = new createjs.Bitmap(srcImg);
stage.addChild(bmp);

该位图可以很好地作为其父库MovieClip的一部分，但是我需要该位图才能执行sourceRect切片……有什么想法吗？

Answer 1

我已经找到了解决方案，尽管我仍然不完全了解跨域限制。

    var img = new Image();
    img.crossOrigin = "Anonymous";
    img.src = loader.getItem("mySpriteSheet").src; // Get the spritesheet source image again
    var frame = new lib.MySourceImage().currentFrame; // In case the sprite moves around in later versions of the spritesheet, get the current position from the library
    var thisFrameData = ss["mySpriteSheet"].getFrame(frame);

我不明白为什么我需要再次标记图像的crossOrigin属性，因为我认为必须在Animate lib首次加载图像时以同样的方式加载图像（尽管我看不到任何具体定义）。

一旦我获得了帧的源数据（基本上是一个矩形），就可以使用x，y，width，height定义该图像中的 new 精灵，沿着{ {3}}，来自Lanny。这恰好满足了我的需要，并且看起来足够高效。

确实让我感到效率低下/不必要，不必再次“加载”图像，但是我看不到明显的替代方法。欢迎任何建议！

Animate库的StageGL跨域错误

1 个答案: