Can I hack Packery.js to create circular bin packing?

Question

this is implemented in python (more tests)

I'm interested in a result like in the image above (implemented in python) using the Packery.js jQuery plugin for js/DOM based bin packing. Packery is built to work from left to right, top to bottom, but I wonder if using a circular bounding box rather the viewport as its boundaries could do the trick.

Ultimately I want to use this to present many image thumbnails with a wide array of sizes and proportions.

Any code examples or other pointers would be highly appreciated.

Here's a CodePen for you to play with:

Answer 1

Yes! See https://github.com/metafizzy/packery/issues/62

In the works.

Development is on the center-out-corner branch. It's in an experimental phase. While this is a neat visual demo, I'm unsure how practical its application is.