Multiple Image Placement Algorithm - Collage Algorithm

Question

I'm creating an application to display multiple videos concurrently (lets say 2-10 videos). I'm basically looking for an algorithm which can aid in the placement of the videos on the screen. The problem I face is that each video may have a different aspect ratio, and I will obviously need to resize the videos to make them all fit on the screen. But I want to resize and fit them in a way that I maximise the use of the screen (and minimise aspect ratio distortion). In addition I want the user to be able to increase the size of one or more videos so it takes more space on the screen. Thus the algorithm should be stable, in the sense that enlarging one video doesn't make all the placements jump around.

I'm asking this question in a language agnostic way, and the fact I'm using video is irrelevant, this problem applies equally to still images.

So does anyone know of a placement algorithm?

To help clarify here is an example. I have three videos, with the following sizes. I want the first video to take up roughly 50% of the screen, and the last two videos to take up roughly 25% of the screen.

(464, 336) 50%
(624, 480) 25%
(608, 336) 25%

How would I place them on the screen (1024x800) to achieve this? I figured I would first divide the screen in half and best fit the first video in the top half. Then I would divide the bottom half into two and fit both remaining videos as best I can.

thanks in advance

Answer 1

I think a Treemap is what you may need.

Good description of the algorithm history here

Ordered quantum treemaps algs, more relevant to your current seach, here

HTH!