HTML5小游戏---爱心鱼（上）_技术问答

首页免费课 HTML5小游戏---爱心鱼（上）问答

HTML5小游戏---爱心鱼（上）

                
                Daisy
            
                    查看讲师更多课程 
                    Daisy讲师的其他课程
                
HTML5小游戏---爱心鱼（下）
中级·46269
免费课程
                                
canvas实现星星闪烁特效
中级·54188
免费课程
                                
                难度中级
            
                时长 2小时34分
            
                学习人数
            
综合评分9.50
                            139人评价
                        查看评价
                                9.6
                                内容实用
                            
                                9.5
                                简洁易懂
                            
                                9.4
                                逻辑清晰

全部评论问答未解决精华

weixin_慕勒4259824

给力点赞！

0 3-1 课程总结

2016-07-04

就是小小

老师养过海水？

0 2-1 绘制背景

2016-07-04

慕粉3599041

firefox 也报那个错。。难道我的chrome版本低？？但是ie内核就可以。getContext就没有缺省值吗==

0 2-1 绘制背景

2016-07-03

_Kamui_

关于在+2π和-2π，主要的作用是选择一个较短的旋转方向
比如从0°旋转到340°，有两个选择：
1、0 -> +340逆时针旋转
2、0-> -20 顺时针旋转

2 2-8 大鱼随鼠标移动

2016-07-03

_Kamui_

Math.PI解决反向的问题（自己的理解）：
1、一开始鱼头默认为0，然后如果玩家鼠标向下偏移Z角度，按照正常的逻辑这个角度应该为π+Z，但是atan2这个函数只能返回-π到π，所以它返回的值为-（π-Z），是大于-π的。
2.然后将这个值加上π 就变成了Z，然后调用rotate（），因为这个Z是个正数，所以会逆时针旋转。
但是如果你没有加上π，就是角度与Z互为补角，方向为顺时针，所以会鱼尾巴跟着鼠标。

3 2-8 大鱼随鼠标移动

2016-07-03

慕粉13006363065

我的海葵一直在跳啊

0 2-3 海葵绘制

2016-06-30

qq_紫陌_0

http://pan.baidu.com/s/1slrcvTz 爱心鱼代码

4 1-1 HTML5小游戏---爱心鱼（上）课程简介

2016-06-30

半个流星

麦克风有问题还是怎么的呀！这声音好烦躁~~~

2 2-4 果实绘制（静态果实）

2016-06-27

依舞清暖

我的果实没出来

1 2-4 果实绘制（静态果实）

2016-06-27

qazzxc3549823

求教下{ctx1.save();ctx1.translate(this.x, this.y);ctx1.drawImage(this.bigEye,-this.bigEye.Width*0.5,-this.bigEye.Height*0.5);ctx1.drawImage(this.bigBode,-this.bigBode.Width*0.5,-this.bigBode.Height*0.5);ctx1.drawImage(this.bigTail,-this.bigTail.Width*0.5,-this.bigTail.Height*0.5);ctx1.restore();}哪错啊

0 2-7 大鱼绘制

2016-06-26

慕粉3443910

讲得非常好！

0 3-1 课程总结

2016-06-26

珂仔踮起脚尖仰望星空

我来回答下为什么尾巴跟着鼠标动：
this.x=lerpDistance(mx, this.x,0.99);
this.y=lerpDistance(my, this.y,0.99);
var deltaY=this.y-my;
var deltaX=this.x-mx;
var beta=Math.atan2(deltaY,deltaX);
把delata改为当前值减去目标值（亲测有效）；

2 2-8 大鱼随鼠标移动

2016-06-25

java家洼

哎呀呀！花了近40小时才跟着老师学习了一遍啊，我这还没有自己独立去写呢，这才是第一阶段啊，OMG，压力山大。

0 3-2 下期课程简介

2016-06-25

java家洼

哎呀妈呀！到这里真不容易，花了我不少时间啊。

0 3-1 课程总结

2016-06-25

java家洼

老师讲的真心好，质量高。

1 2-11 小鱼绘制

2016-06-24

首页上一页 21 22 23 24 25 26 27 下一页尾页

开始学习

课程须知: 1、对html、css基础知识已经掌握。 2、对JavaScript的基础知识掌握，如数组、类、对象。

老师告诉你能学到什么？: 1、html5 canvas制作游戏理念 2、html5 canvas 绘图API 3、游戏中的碰撞检测 4、认识几个数学函数 5、物体池概念 6、序列帧动画的控制

微信扫码，参与3人拼团

热搜

最近搜索清空

HTML5小游戏---爱心鱼（上）