Browsing large image datasets through Voronoi diagrams

1. Browsing large image datasetsthrough Voronoi diagrams Paolo Brivio, Marco Tarini, Paolo Cignoni

2. Targeted image datasets • Fairly large datasets (i.e. 1000s images) • cannot be all visible at the same time • Non-uniform image aspect ratio • landscape vs portrait • image orientation • Total ordering • e.g. time of shot, some ordering defined over calibration, user-defined sequence, etc. • Allow to specify per-image importance • i.e. each image represents a subset of the dataset

3. Conventional image browsers (fullscreen) • Rectangular grid of image thumbnails • [opt] on scrolling panels Explorer by Microsoft Google Image byGoogle Picasa3 by Google FastStone

4. Conventional image browsers (thumbnail bars) • Sequence of image thumbnails • [opt] scrollbars or buttons FastStone Picasa3 by Google PhotoCloudby ISTI-CNR

6. Other drawbacks: non-uniform aspect ratios wasted space Google Image

7. A new type of thumbnail bar focus image

8. Thumbnail sizes far from focus:small thumbnails focus image near to focus:large thumbnails

9. Thumbnail sizes thumbnail size focus image distance from focus in image list 0(focus image) ±10 ±20

10. Clustering images far from focus:each thumbnailrepresents many images focus image near to focus:1 thumbnailfor 1 image

11. Selecting visible images visible image focus image customfuction representativeness hidden image imagenumber 1 2 3 4 5 6 7 focus

12. Spatial ordering x-axis: image ordering respected focus image y-axis: arbitrary previous imagesin the ordering following imagesin the ordering

13. Not only horizontal thumbnail bars • Define a parametric domain in which the ordering is enforced • Arbitrary thumbnail-bar shape enforce ordering custom parametric function Parametric domain Thumbnail-bar shape

14. Transitions new focus focus image focus image • Packing of thumbnails • arbitrary bar shape • irregular shaped thumbnails • varying size • fitting aspect/orientation • image ordering respected • 1 thumbnail per image cluster

15. Transitions new focus • Packing of thumbnails • arbitrary bar shape • irregular shaped thumbnails • varying size • fitting aspect/orientation • image ordering respected • 1 thumbnail per image cluster Animated transition with temporal coherence

16. Autorecentering Voronoi diagrams • Voronoi diagram: • given a set of 2D “seeds” inside a 2D figure F • partition F into as many “regions” • a point belongs to the region of the closest seed • Autorecentering step (Lloyd relaxation): • move seed (●) of each region in its barycenter (+) x 1 x n

17. Taming autorecentering Voronoi diagrams

18. TamingautorecenteringVoronoi diagrams 1/2 • Weighting for region size differentiation • Power Diagram • Dynamic weight balancing • match required region sizes • smooth transitions • including: smooth appear/disappear of regions • Ordering enforcing (over “x”) • interleaved with recentering step • Anisotropy: make regions appropriate • …aspect ratio • …orientation (non axis-aligned)

19. TamingautorecenteringVoronoi diagrams 2/2 • Stabilization • prevent oscillations • Small extra forces • pulling regions toward expected positions • accelerate convergence • Accept user “dragging” mouse gesture • Real time computation • efficient GPU implementation

20. Tamed autorecentering Voronoi diagrams optional bulge-out effect • Packing of thumbnails • arbitrary bar shape • irregular shaped thumbnails • varying size • fitting aspect/orientation • image ordering respected • 1 thumbnail per image cluster Animated transition with temporal coherence

21. Thumbnail creation + resizing - cropping original image + region shape - resizing + cropping

22. Thumbnail creation: with per-image orientation + resizing - cropping original image + region shape - resizing + cropping

23. Example

24. More examples