我花了一夜用数据结构给女朋友写个H5走迷宫游戏 | CSDN 博文精选
- 什么东西简单容易呢?我百度一下,我靠,这个鸟游戏原来不好搞啊,得接触一堆不熟悉的东西,搞不来搞不来。有了(灵光一闪),写个猜数字游戏,问他加减乘除等于几。
- 超越妹妹又不是小孩子,糊弄不过去。
- 经过一番折腾,终于在半夜12点确定写迷宫小游戏了。大概弄清楚其中的几个步骤。
<!DOCTYPE html><html><head><title>MyHtml.html</title></head><body><canvas id="mycanvas" width="600px" height="600px"></canvas></body><script type="text/javascript">var aa=14;var chess = document.getElementById("mycanvas");var context = chess.getContext('2d');// var context2 = chess.getContext('2d');// context.strokeStyle = 'yellow';var tree = [];//存放是否联通var isling=[];//判断是否相连for(var i=0;i<aa;i++){ tree[i]=[];for(var j=0;j<aa;j++){ tree[i][j]=-1;//初始值为0 } } for(var i=0;i<aa*aa;i++){ isling[i]=[];for(var j=0;j<aa*aa;j++){ isling[i][j]=-1;//初始值为0 } }function drawChessBoard(){//绘画for(var i=0;i<aa+1;i++){ context.strokeStyle='gray';//可选区域 context.moveTo(15+i*30,15);//垂直方向画15根线,相距30px; context.lineTo(15+i*30,15+30*aa); context.stroke(); context.moveTo(15,15+i*30);//水平方向画15根线,相距30px;棋盘为14*14;context.lineTo(15+30*aa,15+i*30); context.stroke(); } } drawChessBoard();//绘制棋盘// var mymap=new Array(36);// for(var i=0;i<36;i++)// {mymap[i]=-1;}</script></html>
- 因为我们想要迷宫,那么就需要这个迷宫出口和入口有连通路径,你可能压根不知道迷宫改怎么生成,用的什么算法。小声BB:用并查集(不相交集合)。
- 之前笔者在前面数据结构与算法系列中曾经介绍过并查集(不相交集合),它的主要功能是森林的合并,不联通的通过并查集能够快速将两个森林合并,并且能够快速查询两个节点是否在同一个森林中!
while(search(0)!=search(aa*aa-1))//主要思路 {var num = parseInt(Math.random() * aa*aa );//产生一个小于196的随机数var neihbour=getnei(num);if(search(num)==search(neihbour)){continue;}else//不在一个上 { isling[num][neihbour]=1;isling[neihbour][num]=1; drawline(num,neihbour);//划线 union(num,neihbour); } }
<!DOCTYPE html><html><head><title>MyHtml.html</title></head><body><canvas id="mycanvas" width="600px" height="600px"></canvas></body><script type="text/javascript">//自行添加上面代码// var mymap=new Array(36);// for(var i=0;i<36;i++)// {mymap[i]=-1;}function getnei(a)//获得邻居号 random{var x=parseInt(a/aa);//要精确成整数var y=a%aa;var mynei=new Array();//储存邻居if(x-1>=0){mynei.push((x-1)*aa+y);}//上节点if(x+1<14){mynei.push((x+1)*aa+y);}//下节点if(y+1<14){mynei.push(x*aa+y+1);}//有节点if(y-1>=0){mynei.push(x*aa+y-1);}//下节点var ran=parseInt(Math.random() * mynei.length );return mynei[ran]; }function search(a)//找到根节点{if(tree[parseInt(a/aa)][a%aa]>0)//说明是子节点 {return search(tree[parseInt(a/aa)][a%aa]);//不能压缩路径路径压缩 }elsereturn a; }function value(a)//找到树的大小{if(tree[parseInt(a/aa)][a%aa]>0)//说明是子节点 {return tree[parseInt(a/aa)][a%aa]=value(tree[parseInt(a/aa)][a%aa]);//不能路径压缩 }elsereturn -tree[parseInt(a/aa)][a%aa]; }function union(a,b)//合并{var a1=search(a);//a根var b1=search(b);//b根if(a1==b1){}else {if(tree[parseInt(a1/aa)][a1%aa]<tree[parseInt(b1/aa)][b1%aa])//这个是负数(),为了简单减少计算,不在调用value函数 { tree[parseInt(a1/aa)][a1%aa]+=tree[parseInt(b1/aa)][b1%aa];//个数相加 注意是负数相加 tree[parseInt(b1/aa)][b1%aa]=a1; //b树成为a树的子树,b的根b1直接指向a;}else { tree[parseInt(b1/aa)][b1%aa]+=tree[parseInt(a1/aa)][a1%aa]; tree[parseInt(a1/aa)][a1%aa]=b1;//a所在树成为b所在树的子树 } } }function drawline(a,b)//划线,要判断是上下还是左右{var x1=parseInt(a/aa);var y1=a%aa;var x2=parseInt(b/aa);var y2=b%aa; var x3=(x1+x2)/2;var y3=(y1+y2)/2;if(x1-x2==1||x1-x2==-1)//左右方向的点 需要上下划线 {//alert(x1);// context.beginPath(); context.strokeStyle = 'white';// context.moveTo(30+x3*30,y3*30+15); context.lineTo(30+x3*30,y3*30+45); context.clearRect(29+x3*30, y3*30+16,2,28);// context.stroke(); }else {// context.beginPath(); context.strokeStyle = 'white';// context.moveTo(x3*30+15,30+y3*30); context.lineTo(45+x3*30,30+y3*30); context.clearRect(x3*30+16, 29+y3*30,28,2);// context.stroke(); } }while(search(0)!=search(aa*aa-1))//主要思路 {var num = parseInt(Math.random() * aa*aa );//产生一个小于196的随机数var neihbour=getnei(num);if(search(num)==search(neihbour)){continue;}else//不在一个上 { isling[num][neihbour]=1;isling[neihbour][num]=1; drawline(num,neihbour);//划线 union(num,neihbour); } }</script></html>
结语
我花了一夜用数据结构给女朋友写个H5走迷宫游戏 | CSDN 博文精选相关推荐
- 设计一个算法找一条从迷宫入口到出口的最短路径。_我花了一夜用数据结构给女朋友写个H5走迷宫游戏...
先看效果图(在线尝试请留言): 起因 又到深夜了,我按照以往在公众号写着数据结构!这占用了我大量的时间!我的超越妹妹严重缺乏陪伴而 怨气满满! 超越妹妹时常埋怨,认为数据结构这么抽象难懂的东西没啥作用 ...
- java队列_如何彻底搞懂 Java 数据结构?CSDN 博文精选
作者 | 张振华.Jack 责编 | 郭芮 出品 | CSDN 博客 本文和大家一起来重温<Java数据结构>经典之作. Java数据结构 要理解Java数据结构,必须能清楚何为数据结构? ...
- java 固定长度队列_如何彻底搞懂 Java 数据结构?|CSDN 博文精选
作者 | 张振华.Jack 责编 | 郭芮 出品 | CSDN 博客 本文和大家一起来重温<Java数据结构>经典之作. Java数据结构 要理解Java数据结构,必须能清楚何为数据结构? ...
- 如何彻底搞懂 Java 数据结构?|CSDN 博文精选
作者 | 张振华.Jack 责编 | 郭芮 出品 | CSDN 博客 本文和大家一起来重温<Java数据结构>经典之作. Java数据结构 要理解Java数据结构,必须能清楚何为数据结构? ...
- 520,花一夜给女神写走迷宫游戏
以前虽然写过走迷宫,很多人反映没找到代码不会部署,没看明白原理,这次把更详细写出优化并将代码放到github,趁着520可以自己放一些图片献给女神! 起因 先看效果图(文末有动态图)(在线电脑尝试地址 ...
- 黄猫被汽车撞死 花猫雨夜苦守
黄猫过马路被汽车撞死 花猫同伴雨夜苦守伴侣 悲情镜头 生死不渝花猫雨夜苦守伴侣 2005年05月12日讯 前晚9时许,一只黄猫和同伴嬉戏着穿过书院南街时,不慎被一辆疾驰而过的汽车撞上,黄猫挣扎 ...
- SDUT-2449_数据结构实验之栈与队列十:走迷宫
数据结构实验之栈与队列十:走迷宫 Time Limit: 1000 ms Memory Limit: 65536 KiB Problem Description 一个由n * m 个格子组成的迷宫,起 ...
- Python -- 堆数据结构 heapq - I love this game! - 博客频道 - CSDN.NET
Python -- 堆数据结构 heapq - I love this game! - 博客频道 - CSDN.NET Python -- 堆数据结构 heapq - I love this game ...
- 数据结构和算法(十)递归-迷宫游戏
1. 数据结构和算法(十)递归-迷宫游戏 1.1 迷宫游戏 今天做一个简单的迷宫游戏,用二维数实现地图,让程序自动寻路的小游戏. 1.2 简单的迷宫 简单的迷宫 用二维数实现地图,找路策略:[右- ...
最新文章
- 爬虫准备工作1-Java写入字符串到txt文档
- 皮一皮:直男只想说一句,表白?是表特别白吗?
- 题目1551:切蛋糕
- MVC5网站部署到IIS7
- 工作398-关于e.currentTarget.dataset的取值。
- 人工智能/数据科学比赛汇总 2019.3
- Hyperion神器之SmartView产品(下篇)
- 像智能手机一样造车,可能吗?
- 单片机课设中期报告_毕业论文--中期检查情况报告(40页)详解.doc
- 快速傅里叶变换功率谱密度matlab_信号的频谱 频谱密度 功率谱密度 能量谱密度...
- Spring核心方法 refresh 解析
- python matplotlib 万花筒画板
- 代码随想录第六天 LeetCode 242、349、202、1 (哈希表)
- 计算机主板测试配件,如何检测主板是否有问题_如何诊断主板是否损坏,没有图形步骤...
- Scratch课程设计(四)
- 编译原理:已知文法G(S):S- MH a,H-LSo, K-dML, L-eHf ...,构造LL(1)分析表
- 数据库的连接 SQL Joins
- Win10笔记本电脑硬盘如何分区
- 计算机原理学习(1)-- 冯诺依曼体系和CPU工作原理
- 谷粒商城 集群篇 (五) --------- DevOps
热门文章
- python商城源码_自学Python才几天,就成功编写出俄罗斯方块游戏,附自学教程
- 识别波峰波谷算法_马丁普林格:波峰-波谷演进法
- git 创建邮箱 用户名_厉害了!IDEA中如何使用Git进行项目管理,完整教程来了?...
- a jni error has occurred_A-08 幂函数、有理函数、代数函数
- 世界第一位计算机程序员竟是女的!拜伦之女传奇一生
- 中国到底需要多少博士点?
- 教育部:对于要求家长批改作业,发现一起严处一起
- 年少恶习累累,成年用语言骗全世界, 用心理学撩妹, 最后被总理接见
- 2019世界大学排名全新出炉!清华北大排名大幅下滑?
- 【AI独角兽招聘】这里有一个梦,我们一同前往…