Aleatorizar elementos en una matriz?

Question

He creado un sitio para una artista amiga mía, y ella quiere que el diseño permanezca igual, pero también quiere que las nuevas pinturas que produjo se mezclen con el diseño actual. Así que tengo 12 miniaturas (thumb1 - thumb12) en la página principal de la galería y 18 imágenes (img1 - img18) para colocar también

El enfoque que pensé fue crear una matriz de todas las imágenes, aleatorizarlas, luego simplemente raspar las primeras 12 y cargarlas en las ranuras para pulgares. Otro enfoque sería seleccionar 12 imágenes al azar de la matriz. En el primer caso, no puedo encontrar una manera de aleatorizar los elementos de una matriz. En el último caso, no puedo entender cómo evitar que las imágenes se carguen más de una vez, aparte de usar una segunda matriz, lo que parece muy ineficiente y aterrador.

Estoy haciendo todo esto en Javascript, por cierto.

Answer 1

Escribí esto hace un tiempo y resulta que se ajusta a lo que estás buscando. Creo que es el shuffle de Fisher-Yates al que se refiere ojblass:

Array.prototype.shuffle = function() {
   var i = this.length;
   while (--i) {
      var j = Math.floor(Math.random() * (i + 1))
      var temp = this[i];
      this[i] = this[j];
      this[j] = temp;
   }

   return this; // for convenience, in case we want a reference to the array
};

Tenga en cuenta que modificar Array.prototype puede considerarse una forma incorrecta. Es posible que desee implementar esto como un método independiente que tome la matriz como argumento. De todos modos, para terminar:

var randomSubset = originalArray.shuffle().slice(0,13);

O, si no desea modificar realmente el original:

var randomSubset = originalArray.slice(0).shuffle().slice(0,13);

Answer 2

Debe implementar Fisher-Yates shuffle (también conocido como Knuth shuffle ).

Mire la gran respuesta proporcionada aquí .

Answer 3

Tu primer enfoque funcionaría. Simplemente baraja los 18 elementos y toma los primeros 12.

Answer 4

Recientemente me encontré con este problema. La publicación aquí ayudó: http://waseemsakka.com/2012/02/14/javascript-dropping-the-last-parts-of-an-array-and-randomizing-the-order-of -an-array / .

Básicamente, comience aleatorizando su matriz:

thumbs.sort(function(a, b) {
     return Math.random() - 0.5;
})

Esto aleatorizará el orden de tus 18 elementos. Luego, para mantener solo los primeros 12 elementos, simplemente debe soltar los últimos 6:

thumbs.length = 12;