炫丽的倒计时效果Canvas绘图与动画基础_技术笔记

pinzaghi 2019-12-02

碰撞检测时，小球y位置置0，vy反向

截图
0赞 · 0采集
慕瓜0079440 2019-10-02

4-2 使用canvas做个物理实验

截图
0赞 · 0采集
慕瓜0079440 2019-10-02

4-2 使用canvas做个物理实验

截图
0赞 · 0采集
慕九州5545268 2018-01-17

仔细看代码啊

截图
0赞 · 0采集
辉夜羽衣 2017-12-07

当坐标y值大于768-小球半径时，也就是触底时，y值为768-r，立刻获得一个等大的相反速度，反弹。但是vy一直在加，直到vy变成0的时候，又向下落。但是有0.5的阻力的时候，反弹过来的速度就会变小，所能弹的高度也就变小。最后接近于0。是因为速度的改变为0，到顶点下落。是因为触底，瞬间获得相反的速度，才向上反弹

截图
0赞 · 0采集
weibo_学会了懂夜的黑_0 2017-06-10

碰撞检测

截图
0赞 · 0采集
weibo_学会了懂夜的黑_0 2017-06-10

运动程序

截图
0赞 · 0采集
标标哟 2017-03-06

clearRec(0,0,context.canvas.width,context.canvas.height) Json的使用：var ball={x:512,y:100,g:2,vx:-4,vy:0,color:"color"};

0赞 · 0采集
阿一凡 2017-03-03

function update(){ //下落 ball.x += ball.vx;//x = vx*t ball.y += ball.vy;//y = vy*t ball.vy += ball.g;//vy = g*t //下边碰撞 if(ball.y >= 768 -ball.r){ ball.y = 768 -ball.r ball.vy = -ball.vy*0.9 } //右边碰撞 if(ball.x >= 1024 -ball.r){ ball.x = 1024 -ball.r ball.vx = -ball.vx*0.9 } //左边碰撞 if(ball.x <= ball.r){ ball.x = ball.r ball.vx = -ball.vx*0.9 } }

0赞 · 0采集
慕粉1956174443 2017-01-26

碰撞检测

0赞 · 0采集
梦林苑3290767 2016-11-10

物理学模拟

截图
0赞 · 0采集
qq__1939 2016-10-10

2.碰撞检测及速度损耗

截图
0赞 · 1采集
qq__1939 2016-10-10

定义一个球，g为重力加速度，vx为x方向速度，vy是y方向速度

截图
0赞 · 2采集
ID216 2016-09-11

简单的碰撞检测

截图
0赞 · 2采集
一止水 2016-08-10

初始化小球的状态 x:512,y:100代表小球的初始坐标，r：20代表半径20，g:2加速度为2 vx：-4 代表x轴上的方向是4，负号代表方向 vy：0 竖直方向的速度为0 颜色color

0赞 · 1采集
Bettyzhong 2016-07-25

ball={ x:512//小球中心点的水平位置 y:100//小球中心点的垂直位置 r:20//小球半径 g:2// 运动加速度 vx:-4//小球运动的水平速度 vy:0//小球运动的垂直速度 }

截图
1赞 · 1采集
侧耳倾听_逆光飞翔 2016-06-08

初始化小球的状态 x:512,y:100代表小球的初始坐标，r：20代表半径20，g:2加速度为2 vx：-4 代表x轴上的方向是4，负号代表方向 vy：0 竖直方向的速度为0 颜色color

截图
0赞 · 4采集
Tsukiis 2016-03-04

在canvas上实现小球下落的运动学效果，实际上就是把小球的位移位置一帧一帧地计算出来

0赞 · 1采集
呵Sever 2016-02-25

function update(){ //下落 ball.x += ball.vx;//x = vx*t ball.y += ball.vy;//y = vy*t ball.vy += ball.g;//vy = g*t //下边碰撞 if(ball.y >= 768 -ball.r){ ball.y = 768 -ball.r ball.vy = -ball.vy*0.9 } //右边碰撞 if(ball.x >= 1024 -ball.r){ ball.x = 1024 -ball.r ball.vx = -ball.vx*0.9 } //左边碰撞 if(ball.x <= ball.r){ ball.x = ball.r ball.vx = -ball.vx*0.9 } }

1赞 · 9采集
呵Sever 2016-02-25

function update(){ ball.x += ball.vx;//x = vx*t ball.y += ball.vy;//y = vy*t ball.vy += ball.g;//vy = g*t }

截图
0赞 · 0采集
梦想的天空 2015-12-21

模拟阻力，添加摩擦系数

截图
0赞 · 1采集
很懒的熊 2015-10-19

加速度 g 速度 v

0赞 · 0采集
ttxx天天向上 2015-10-12

模拟阻力，添加摩擦系数

截图
0赞 · 0采集
ttxx天天向上 2015-10-12

碰撞检测

截图
0赞 · 2采集
ttxx天天向上 2015-10-12

改变位置，形成抛物线

截图
0赞 · 2采集
大青山Z 2015-09-20

context.cleaerReact(x,y,width,height); 清除绘画

0赞 · 0采集
fat401 2015-08-16

function update(){ ball.vy+=ball.g; ball.x+=ball.vx; ball.y+=ball.vy; if (ball.y>600-ball.r) { ball.y=600-ball.r; if(Math.abs(ball.vy)>2) {ball.vy=-ball.vy*0.75;} else{ if(Math.abs(ball.vx)<0.2){ ball.vx=0; } else{ ball.vx=ball.vx>0?ball.vx-0.05:ball.vx+0.05; } } } if(ball.y<ball.r){ ball.y=ball.r; ball.vy=-ball.vy*0.75; } if(ball.x<ball.r){ ball.x=ball.r; ball.vx=-ball.vx*0.75; } if(ball.x>1300-ball.r){ ball.x=1300-ball.r; ball.vx=-ball.vx*0.75; } }

0赞 · 0采集
Cleam 2015-05-26

把碰撞动能损失和地板滚动摩擦考虑进去。 function update(){ ball.vy+=ball.g; ball.x+=ball.vx; ball.y+=ball.vy; if (ball.y>600-ball.r) { ball.y=600-ball.r; if(Math.abs(ball.vy)>2) {ball.vy=-ball.vy*0.75;} else{ if(Math.abs(ball.vx)<0.2){ ball.vx=0; } else{ ball.vx=ball.vx>0?ball.vx-0.05:ball.vx+0.05; } } } if(ball.y<ball.r){ ball.y=ball.r; ball.vy=-ball.vy*0.75; } if(ball.x<ball.r){ ball.x=ball.r; ball.vx=-ball.vx*0.75; } if(ball.x>1300-ball.r){ ball.x=1300-ball.r; ball.vx=-ball.vx*0.75; } }

2赞 · 8采集
仙人掌_0005 2015-05-15

function update() { ball.x += ball.vx; ball.y += ball.vy; ball.vy += ball.g; //bottom if (ball.y >= 500 - ball.r) { ball.y = 500 - ball.r; ball.vy = -ball.vy; } //top if (ball.y <= 0 + ball.r) { ball.y = ball.r; ball.vy = -ball.vy; } //left if (ball.x <= 0 + ball.r) { ball.x = ball.r; ball.vx = -ball.vx; } //right if (ball.x >= 1024 - ball.r) { ball.x = 1024-ball.r; ball.vx = -ball.vx; }

0赞 · 0采集
仙人掌_0005 2015-05-15

学到了很多东西开始定义的不是数组，是json，自己感觉好像java程序中的实体类。有收获

0赞 · 1采集

数据加载中...