Let's say I have some abstract shapes defined each with a width and height (let's make them rectangles for the sake of simplicity). How can I place as many of them as possible on a single canvas (just a term, not necessarily HTML5 canvas) of a defined width and height?
Obviously this is some sort of constraint satisfaction problem, but I don't really know where to start (besides brute force). Googling just turns up unrelated results (probably because I don't know what to search for). What would be a good algorithm or what would be a good way to go about creating an algorithm to do this?
Fizz is a good example. Shapes (circles, in this case) appear in groups and don't overlap each other and they stay out of each other's way. My use case is more of a one time positioning deal. Another example is SpriteRight, which places as efficiently as possible within certain boundaries.