I'm trying to write a JavaScript function that randomly fills a rectangular space with small rectangles of different sizes. Something like this:



The problem is calculating their sizes and positions. I need them to fit together so that there isn't much "white space" left over. A constant margin between them of, say, 20 pixels would be ideal but is not essential.

Normally I'd use a "brute force" approach, keeping track of every pixel and "falsing" it when it gets covered by a block, but since the total space will be 800x800, that method would take a long time to calculate.

Is there any quicker, smarter way to do this?

Thanks,
Seymour.