Last active
November 21, 2023 01:22
-
-
Save ayamflow/64d00589546c730b93ab85627acad66d to your computer and use it in GitHub Desktop.
threejs Texture Atlas (TexturePacker spritesheet)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import _ from 'underscore'; | |
export default class TextureAtlas { | |
constructor(json, image) { | |
this._textures = {}; | |
let texture = new THREE.Texture(image); | |
texture.needsUpdate = true; | |
let frames = json.frames; | |
_.keys(frames).forEach(function(key, i) { | |
let frame = frames[key]; | |
let t = texture.clone(); | |
let data = frame.frame; | |
t.repeat.set(data.w / image.width, data.h / image.height); | |
t.offset.x = ((data.x) / image.width); | |
t.offset.y = 1 - (data.h / image.height) - (data.y / image.height); | |
t.needsUpdate = true; | |
this._textures[key.replace('.png', '').toLowerCase()] = t; | |
}, this); | |
} | |
get(id) { | |
return this._textures[id]; | |
} | |
} |
@Josema hi! It was called "JSON". This is 6-7 years old so idk if texture packer has the same optjon anymore 😬
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Hello, what format are you using for the JSON exported by TexturePacker?