将 PIXI 精灵从纹理循环中答案

【问题标题】：Placing a PIXI sprite in a loop from a texture将 PIXI 精灵从纹理循环中
【发布时间】：2020-11-27 14:04:40
【问题描述】：

当我的对象中的项目具有特定值时，我将纹理中的图像放置在容器上。

我的代码确实在我想要的每个位置放置了一张图片，但我遇到的问题是每张图片都是相同的。因为到处出现的图像是数组中的最后一个，我猜我循环的方式有问题，另一方面，我尝试了各种不同的循环方式，结果对我来说从来没有不同。也许我用错了 PIXI？

const texture = PIXI.utils.TextureCache.skills

const values = Object.values(treeData.nodes).filter(obj => {
    return obj.isKeystone === true
})

values.forEach(node => {
    const spriteData = treeData.skillSprites.keystoneInactive[3].coords[node.icon]
    // if i console my spriteData here, it looks fine and i get different data everytime
    const rectangle = new PIXI.Rectangle(spriteData.x, spriteData.y, spriteData.w, spriteData.h)
    texture.frame = rectangle

    const image = new PIXI.Sprite(texture)
    image.anchor.set(0.5)
    image.x = node.x
    image.y = node.y
    spriteContainer.addChild(image)
})

【问题讨论】：

标签： javascript pixi.js

【解决方案1】：

也许您还必须制作新纹理？否则，您只需不断重置相同纹理的框架。

const frame = new PIXI.Rectangle(spriteData.x, spriteData.y, spriteData.w, spriteData.h)
const newTexture = new PIXI.Texture(texture, frame)
const image = new PIXI.Sprite(newTexture)

【讨论】：