Grouping rectangles to single bin
tionkje opened this issue · comments
I have a set of rectangles that have to be packed into some bins.
But there are some rects that have to be together in the same bin (to prevent multiple textures in a shader)
Is there a way to achieve this using tags?
I noticed currently each tag creates a new bin, and a bin with a tag does not accept any untagged rects.
Yes, I think we don't have that feature yet. Currently, rect without tag will have a defaut bin tag, thus tagged rects will not packed into the defaut bins.
It will be epic if it is implemented. My use case is packing animated sprites into atlases, but not spreading any animation over multiple atlases.
I have some heuristics in mind that might help with this job, but I need to check whether an array of rectangles may fit into the current bin prior to actually adding them. Maybe I can do it with packer.save() method. Will share the results later once I flesh out my alorithm.
Implemented on branch https://github.com/soimy/maxrects-packer/tree/non-exclusive-tag
introducing new packer option exclusiveTag, if set to false, packer will try to pack sprites with the same tag into the same bin, if all bin cannot fit, new bin is created.
Test needed @CosmoMyzrailGorynych @tionkje
Ok, time to make some tests.
For the record, I ended up with this code that did the job: https://github.com/ct-js/ct-js/blob/ac6f02c103b123e510999add3669c81f205914f7/src/node_requires/exporter/textures.js#L163-L323
This feature is merged in the new 2.7.0 version, just update maxrects-packer
Ok, here is the "comparison". Both cases use the same set of sprites. Restrictions:
- Each sprite/animation has a unique tag.
- Each ship has a pair of sprites (With and without a jet flame). Pairs should not be separated.
- All the aliens from https://kenney.nl/assets/platformer-pack-redux (side-view aliens) should be on one atlas. They are in one sprite.
- Small items from https://kenney.nl/assets/platformer-pack-redux (keys, flags) are individual sprites that can be packed arbitrarily.
First case — 2048x2048 atlases.
It is expected that there will be a lot of backgrounds alone in separate atlases, as they have padding and two of them won't fit.
My approach: (13 bins)
https://github.com/soimy/maxrects-packer/tree/non-exclusive-tag (12 bins)
Okay, this case sucks, now:
Second case — 4kx4k bins
My approach (2 bins):
https://github.com/soimy/maxrects-packer/tree/non-exclusive-tag (2 bins):
Observations
Both methods seem to work. My method seems to be more space-efficient with sprites relatively smaller than the bin's size.
There is no sorting algorithm across numerous tags in https://github.com/soimy/maxrects-packer/tree/non-exclusive-tag (using
b4827b8 commit), or there is something wrong with it. See the 4kx4k case. We clearly see that the a0 atlas (on the left) could contain all the coins, flags, diamons, and keys (they all have different tags), and probably all the aliens, too. It seems that it creates a new bin after the first failure, skipping all the smaller rectangles. I feel that a combination of very wide and very long sprites will make unreasonably large amount of bins (will try to do so soon).
Ok so I set up that "extreme" case with horizontal/vertical sprites:
3 boxes of 2000x64 size and 3 rects of 64x2000 (blue ones).
2 rects of 1800x64 and 2 of 64x1800 (pink ones).
Each rect is tagged, but each rects' tag is unique.
Bins are restricted to be at max 2048x2048 pixels.
Here is how I created them: one vertical, one horizontal, one vertical, one horizontal...
A simple solution is putting all the vertical rects in one bin, and the horizontal ones — into another. We can get 2 bins this way.
The results
They both are awful.
Upper images — v2.7.0, bottom images — my approach. Both produce 4 bins.
In v2.7.0, all the images are added through packer.addArray(blocks); in one go.
And here is the packed result without tagging at all:
Thanks, @CosmoMyzrailGorynych ! Very detailed testing.
Currently, I do not have time to do any practical case test so yours is really helpful!.
New tweak on logic by commit 8b59925, let's see it will make any difference.
I just adopted this new feature into my Repo https://github.com/soimy/atlasify by adding new option --group-folder. Everything working as expected so far.
fix: Non-exclusive tag logic: Restart test iteration on next tag group
:D
Testing 8b59925
"Extreme" case with very long/very tall images:
Perfect 👌
Aliens and ships, 2k×2k
11 atlases, it is an improvement if compared to the previous 12 atlases from v2.7.0. 👍
Aliens and ships, 4k×4k
Does the job in a pretty optimal way 👏
Summary
Great work 👏 I feel it is time to ship 8b59925 and close this issue 🚀
Close via eb3c665
New version is now https://github.com/soimy/maxrects-packer/releases/tag/v2.7.1