Ordenar y recortar imágenes dinámicas similares a google + álbum ver

Question

¿alguien me puede ayudar a encontrar una solución para lograr el mismo resultado que el google plus album view?

La lista de miniaturas logra mantener un ancho de fila constante al volver a ordenar Y recortar las imágenes para que quepan todo el tiempo, y las reorganiza de acuerdo con el tamaño de la ventana.

que sé sobre masonry pero tiende a crear una gran cantidad de espacio en blanco cuando las imágenes no tienen el mismo tamaño ... (ya que no se ocupa de cultivo)

¿Alguien sabe de un plugin que hace ¿ese? o si no la matemática básica detrás de eso?

Answer 1

Lo que encontré en google plus y puede ser que pueda ayudarte.

1. Cortan algunas imágenes para que quepa. Usted easely lo puede encontrar en la primera imagen
2. Tienen líneas de las imágenes con la misma altura

lo tanto, es la facilidad para hacer eso. Puede ajustar las imágenes a la misma altura escalando al principio y en cada línea puede cortar un poco más para ajustar el ancho de la línea.

O, dicho sea de paso, Si va a Strach ventana de cromo con Google + servicio no se ven tan bien como lo fue, algunas lagunas apear para algunas líneas

Answer 2

esto es quizá un poco exagerado por lo que eres buscando.

Puede usar el algoritmo Simulated Annealing, que se usa comúnmente en electrónica para encontrar el diseño óptimo para todos los pequeños componentes electrónicos dentro de un área restringida de microchip, que es básicamente el mismo problema de encontrar el mejor diseño para un conjunto de imágenes dentro de una ventana del navegador.

Básicamente, este algoritmo le ofrece una buena solución pero no garantiza ser el mejor. Lea atentamente el artículo de Wikipedia, ya que explica mejor que yo.

También puede consultar este Simulated Annealing applet para el problema Vendedor. Pruebe con una temperatura de 500 y observe lo que sucede cuando se enfría.

Espero que esto ayude.

Answer 3

echar un vistazo a:

http://blog.vjeux.com/2012/javascript/image-layout-algorithm-google-plus.html

En él se explica cómo funciona el diseño.

también echar un vistazo a: http://www.techbits.de/2011/10/25/building-a-google-plus-inspired-image-gallery/ http://www.moewashere.com/jglance/

que son ambas implementaciones del google y de álbumes rejilla.