我最近因为做了几个小游戏，用到了二维数组，其中有需求将这个二维数组正翻转 90°，-90°，180°。

本人是笨人，写下了存起来。

定义的基本二位数组渲染出来是这种效果。

现在想实现的结果是下面的效果：

当然可以让div用position定位，left和top调整。

但是我就想改变数组的话，我的笨办法：用两重for循环，重新创建一个数组。

规律是：向右转90°时候， i （列）变成j（行）后 将所在行的位置倒过来 ，j变成 i不变，很难表述，一看代码便知。

同理：向左旋转时候，列和行交换，但是交换后，将列倒过来。

转180度，行不变，列倒过来。

270度。等于先转180度再转90度。或者原来行变列后，将这个新列倒过来，    原来的列变成行；

不贴图了，意思到了就能做出来了。重点就是行和列的交换

用js实现二维数组的旋转的更多相关文章

  1. C#/JS 获取二维数组组合

    C#获取二维数组组合 using System; using System.Collections.Generic; using System.Linq; using System.Text; usi ...

  2. JS的二维数组

    今天,记录一下JS的二位数组,并附上例题. 一.二维数组的本质:数组中的元素又是数组. 其实,我们都见过这样的二维数组,只不过没在意罢了,例如: var arr = [[1,2,4,6],[2,4,7 ...

  3. js 将二维数组转为一维数组

    方法一 使用ES的最新语法:Array.prototype.flat(). flat([dept]),参数 dept 为数组的深度,默认为1,根据传入的深度将数组展开. 对于不确定深度的数组,可以传入 ...

  4. js 输出二维数组的最大值

    function num(arr){ max=a[0][0]; for (var i = 0; i < a.length; i++) { for (var j = 0; j< a[i].l ...

  5. js输出二维数组最长的子数组

    ,,],[,,,],[,,,,]]; ].length; ; i < a.length; i++) { if (max<a[i].length) { max=a[i].length; va ...

  6. JS遍历二维数组

    //求平均数 var pjs=[ ['小明',87], ['小红',81], ['小花',97], ['小天',76], ['小张',74], ['小小',94], ['小西',90], ['小武', ...

  7. js 如何生成二维数组

    想了几种方法都不能很好的,用js定义二维数组.这种定义,指的是:定义按需确认数组大小. 网上看了下,都是用for循环创建,大小必须提前设定.不是我想要的.(感觉不能和php一样,真是麻烦!) 先贴出代 ...

  8. php 二维数组传递给 js 问题解决记录

    需求: php从数据库中读取到二维数组.传递到js中 实现步骤: php:json_encode  →   json  →  js:eval 即在php中使用json_encode()将php的二维数 ...

  9. day4 二维数组旋转90度

    二维数组的旋转其实就是数组里面的元素对调的情况:下面有一个4×4的二维数组,[[0, 1, 2, 3], [0, 1, 2, 3], [0, 1, 2, 3], [0, 1, 2, 3]],现在要求把 ...

随机推荐

  1. Pipenv和Python虚拟环境

    Pipenv & 虚拟环境 本教程将引导您完成安装和使用 Python 包. 它将向您展示如何安装和使用必要的工具,并就最佳做法做出强烈推荐.请记住, Python 用于许多不同的目的.准确地 ...

  2. set 容器的用法

    1.set容器的理解 所有元素都会根据元素的键值自动排序,set元素的键值就是实值,实值就是键值.set不允许两个元素有相同的键值.(set的元素不像map那样可以同时拥有实值(value)和键值(k ...

  3. linux apache2部署php

    apache2 doc http://blog.csdn.net/actor1999/article/details/44802519 #apache sudo apt-get install apa ...

  4. Python import其他文件夹的文件

    一般情况下,import的文件和被import的文件在同一个路径下面,import也比较方便.如果这两个文件不在一个路径下面,import就比较麻烦了,需要在被import的文件路径下面新建一个__i ...

  5. 对 IIC 总线的理解、调用函数以及常见面试问题

    一.IIC 总线概述: IIC 即Inter-Integrated Circuit(集成电路总线) I2C总线是PHLIPS公司推出的一种串行总线, I2C总线只有两根双向信号线.一根是数据线SDA, ...

  6. 在 java 开发接口中需要注意的问题

    1 在开发过程中免不了对接上游或下游,有合作就要保证入参.出参的准确性.一个接口一般只能处理有限情况下的情况,因此在逻辑处理前要对入参进行校验. 2 在自己的逻辑处理过程中,要时刻持有怀疑的态度.假设 ...

  7. ProtoBuf3 C++使用篇

    protobuf 是用于结构化数据串行化的灵活.高效.自动化的解决方案.又如 XML,不过它更小.更快.也更简单.你只需要按照你想要的数据存储格式编写一个.proto,然后使用生成器生成的代码来读写这 ...

  8. Linux下C语言执行shell命令

    有时候在代码中需要使用到shell命令的情况,下面就介绍一下怎么在C语言中调用shell命令: 这里使用popen来实现,关于popen的介绍,查看 http://man7.org/linux/man ...

  9. HMACSHA1 加密算法

    https://blog.csdn.net/z69183787/article/details/78393216 ******************************************* ...

  10. IndexedDB 教程

    IndexedDB 教程 IndexedDB 是一个基于 JavaScript 的面向对象的事务型数据库.有了 LocalStorage 和 Cookies,为什么还要推出 indexedDB 呢?其 ...