Как я могу повернуть данную матрицу на один элемент по часовой стрелке в javascript?

Question

Я пишу короткую программу, которая вращает данную матрицу NxN следующим образом:

┌     ┐    ┌     ┐ 
|1 2 3|    |4 1 2| 
|4 5 6| -> |7 5 3| 
|7 8 9|    |8 9 6|   
└     ┘    └     ┘

var a = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

for (var i = 0; i < a.length; i++) {
  for (var j = 0; j < a[i].length; j++) {
    document.write(a[i][j]);
  }
  document.write('<br>');
};

Я получил отсортированный l oop и массив, но я не могу понять, как повернуть его по часовой стрелке. Это действительно становится головной болью.

Вся помощь приветствуется. :)

Answer 1

Вы можете перемещать каждую сторону и использовать смещение для колец.

Этот подход использует четыре цикла, по одному для каждой стороны матрицы, и предварительно сохраняет значение верхнего левого положения каждого кольца.

Затем все элементы перемещаются, а элементы всех сторон также перемещаются. Наконец, на последнем l oop сохраненный элемент перемещается на новую позицию.

Пример алгоритма:

2D Array  1  2  3  4  5
          6  7  8  9 10
         11 12 13 14 15
         16 17 18 19 20
         21 22 23 24 25
------- ---------------- ---------------- ---------------- ---------------- ----------------
         take value for   1st loop         2nd loop         3rd loop         4th loop
         insert in 4th    left side up     bottom left      right down       top right
------- ---------------- ---------------- ---------------- ---------------- ----------------
Ring 0  [ 1] 2  3  4  5    6  .  .  .  .    .  .  .  .  .    .  .  .  .  .    .[ 1] 2  3  4
          6  .  .  . 10   11           .    .           .    .           5    .           .
         11  .  .  . 15   16           .    .           .    .          10    .           .
         16  .  .  . 20   21           .    .           .    .          15    .           .
         21 22 23 24 25    .  .  .  .  .   22 23 24 25  .    .  .  .  . 20    .  .  .  .  .

Ring 1    .  .  .  .  .                                                      
          .[ 7] 8  9  .      12  .  .          .  .  .          .  .  .          .[ 7] 8
          . 12  . 14  .      17     .          .     .          .     9          .     .
          . 17 18 19  .       .  .  .         18 19  .          .  . 14          .  .  .
          .  .  .  .  .
------- ---------------- ---------------- ---------------- ---------------- ----------------
Result    6  1  2  3  4
         11 12  7  8  5
         16 17 13  9 10
         21 18 19 14 15
         22 23 24 25 20

function rotate(array) {

    function rotateRing(offset) {
        var i = offset,
            j = offset,
            l = array.length - offset,
            last = array[i][j];

        for (; i + 1 < l; i++) array[i][j] = array[i + 1][j];
        for (; j + 1 < l; j++) array[i][j] = array[i][j + 1];
        for (; i > offset; i--) array[i][j] = array[i - 1][j];
        for (; j > offset; j--) array[i][j] = j - 1 === offset ? last : array[i][j - 1];
    }

    for (var i = 0, l = array.length >> 1; i < l; i++) rotateRing(i);
    return array;
}

function print(array) {
    array.forEach(a => console.log(...a.map(v => v.toString().padStart(2))));
    console.log('');
}

var array3 = [[1, 2, 3], [4, 5, 6], [7, 8, 9]],
    array4 = [[1, 2, 3, 4], [5, 6, 7, 8], [9, 10, 11, 12], [13, 14, 15, 16]],
    array5 = [[1, 2, 3, 4, 5], [6, 7, 8, 9, 10], [11, 12, 13, 14, 15], [16, 17, 18, 19, 20], [21, 22, 23, 24, 25]];

print(array3);
rotate(array3);
print(array3);

print(array4);
rotate(array4);
print(array4);

print(array5);
rotate(array5);
print(array5);

.as-console-wrapper { max-height: 100% !important; top: 0; }