用js实现二维数组的旋转
我最近因为做了几个小游戏,用到了二维数组,其中有需求将这个二维数组正翻转 90°,-90°,180°。
本人是笨人,写下了存起来。
定义的基本二位数组渲染出来是这种效果。


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

当然可以让div用position定位,left和top调整。
但是我就想改变数组的话,我的笨办法:用两重for循环,重新创建一个数组。
规律是:向右转90°时候, i (列)变成j(行)后 将所在行的位置倒过来 ,j变成 i不变,很难表述,一看代码便知。

同理:向左旋转时候,列和行交换,但是交换后,将列倒过来。
转180度,行不变,列倒过来。
270度。等于先转180度再转90度。或者原来行变列后,将这个新列倒过来, 原来的列变成行;
不贴图了,意思到了就能做出来了。重点就是行和列的交换
用js实现二维数组的旋转的更多相关文章
- C#/JS 获取二维数组组合
C#获取二维数组组合 using System; using System.Collections.Generic; using System.Linq; using System.Text; usi ...
- JS的二维数组
今天,记录一下JS的二位数组,并附上例题. 一.二维数组的本质:数组中的元素又是数组. 其实,我们都见过这样的二维数组,只不过没在意罢了,例如: var arr = [[1,2,4,6],[2,4,7 ...
- js 将二维数组转为一维数组
方法一 使用ES的最新语法:Array.prototype.flat(). flat([dept]),参数 dept 为数组的深度,默认为1,根据传入的深度将数组展开. 对于不确定深度的数组,可以传入 ...
- js 输出二维数组的最大值
function num(arr){ max=a[0][0]; for (var i = 0; i < a.length; i++) { for (var j = 0; j< a[i].l ...
- js输出二维数组最长的子数组
,,],[,,,],[,,,,]]; ].length; ; i < a.length; i++) { if (max<a[i].length) { max=a[i].length; va ...
- JS遍历二维数组
//求平均数 var pjs=[ ['小明',87], ['小红',81], ['小花',97], ['小天',76], ['小张',74], ['小小',94], ['小西',90], ['小武', ...
- js 如何生成二维数组
想了几种方法都不能很好的,用js定义二维数组.这种定义,指的是:定义按需确认数组大小. 网上看了下,都是用for循环创建,大小必须提前设定.不是我想要的.(感觉不能和php一样,真是麻烦!) 先贴出代 ...
- php 二维数组传递给 js 问题解决记录
需求: php从数据库中读取到二维数组.传递到js中 实现步骤: php:json_encode → json → js:eval 即在php中使用json_encode()将php的二维数 ...
- day4 二维数组旋转90度
二维数组的旋转其实就是数组里面的元素对调的情况:下面有一个4×4的二维数组,[[0, 1, 2, 3], [0, 1, 2, 3], [0, 1, 2, 3], [0, 1, 2, 3]],现在要求把 ...
随机推荐
- OKDownload 下载框架 断点续传 MD
Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱 MyAndroidBlogs baiqiantao baiqiantao bqt20094 baiqiantao@sina ...
- 运行Keras版本的Faster R-CNN(1)
Keras版本的Faster R-CNN源码下载地址:https://github.com/yhenon/keras-frcnn下载以后,用PyCharm打开(前提是已经安装了Tensorflow-g ...
- 每天一个linux命令(5):rmdir
1.命令简介 rmdir (Remove Directory删除目录): 用来删除空目录,删除某目录时也必须具有对父目录的写权限. 2.用法 用法:rmdir [选项]... 目录... 3.选项 - ...
- 【Linux】磁盘读写 测试
一.如何查看当前磁盘的IO使用情况 使用命令:iotop Total DISK READ: 3.89 K/s | Total DISK WRITE: 0.00 B/s TID PRIO USER DI ...
- 解决windows 下 mysql命令行导入备份文件 查询时乱码的问题
Mysql导入乱码,一般在命令行会遇到.下面说的是命令行的情况下解决乱码问题: 方法一: 通过增加参数 –default-character-set = utf8 解决乱码问题 mysql -uroo ...
- 企业级镜像仓库Harbor
介绍: Habor是由VMWare公司开源的容器镜像仓库.事实上,Habor是在Docker Registry上进行了相应的企业级扩展,从而获得了更加广泛的应用,这些新的企业级特性包括:管理用户界面, ...
- BizTalk Map 累积连接字符串
更多内容请查看:BizTalk动手实验系列目录 BizTalk 开发系列 BizTalk 培训/项目开发/技术支持请联系:Email:cbcye ...
- 下载Chrome商店和Youtube资源
下载chrome浏览器插件 站点:http://cooal.cn/crx.php 操作步骤: 1.打开扩展介绍页面 (在 三道杠图标>工具>扩展程序 里相应扩展的"访问网站&qu ...
- 【iCore4 双核心板_FPGA】实验十九:使用JTAT UART终端打印信息
实验指导书及源代码下载地址: 链接:https://pan.baidu.com/s/1c3mqDkW 密码:4x9h iCore4链接:
- php cli模式下获取参数的方法
转载声明:http://blog.csdn.net/fdipzone/article/details/51945892 php在cli模式下接收参数有两种方法 1.使用argv数组 <?php ...