博客专栏  >  前端   >  CANVAS

CANVAS

CAVNAS入门练习

关注
1 已关注
15篇博文
  • 边界检测,Math.random的妙用,喷射的霰弹

    边界生成,通过鼠标控制小球运动,碰到边界停止在线demo<!DOCTYPE html> <html lang="en"> ...

    2018-02-11 11:49
    64
  • 十六.碰撞检测,外接圆检测,外接矩形检测,多个物体两两比较

    简单的碰撞检测的常见方法有:1.外接矩形判断2.外接圆判断一,外接矩形判断判断两个矩形是否发生碰撞,只需要判断:两个矩形左上角的坐标所处的范围,如果两个矩形的左上角的坐标满足一定的条件,两个矩形就发生...

    2018-02-11 14:49
    98
  • 十七,捕获物体,拖拽物品,投掷物品

    一,捕获对于物体捕获主要有一下四种情况:1.矩形捕获2.圆形的捕获3.多边形的捕获4.不规则性圆形的捕获多边形的捕获和不规则圆形的捕获才用分离轴定理(SAT)和最小偏移量(MTV)没接触过,听说很难,...

    2018-02-11 15:36
    86
  • 十八。缓动动画 一个小球跟随鼠标 2个小球跟随鼠标

    简述:缓冲动画是一个物体从滑动到某个目标就停下来。缓冲动画是指带有一定减速效果(可以直接理解某个属性值变化量慢慢的变小,直到物体达到目标值“这个变化值”为0,加速度从大到小)实现缓冲动画需要牢记一下几...

    2018-03-02 21:43
    66
  • 十八.2弹性动画 小球,悠悠球

    先上demo<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"&...

    2018-03-02 22:32
    75
  • 十九小球解说运动,鼠标交互,弹性运动

    煮酒论英雄,小球趣说运动1.缓动动画2.弹性运动鼠标跟随鼠标在线demo如果我们的鼠标做圆周运动,我们惊讶的发现不知不觉中我们实行了一个橡皮筋绑着小球甩圈圈的效果。童年味道满满的(✪ω✪)&l...

    2018-03-02 22:47
    83
  • 十四.2匀速运动,匀速运动速度的合成和分解

    一,匀速运动匀速运动,又称为匀速直线运动,是指物体在一条直线上运动,并且物体在任何时间间隔内通过的位移都是相等的。从上面可知,匀速运动需要具备2个条件,及速度大小相同和速度方向一致匀速运动是一种加速度...

    2018-02-09 23:16
    93
  • 十四.2加速度运动,加速度的合成和分解

    加速度运动,是指方向相同、速度大小变化的运动。速度递增是加速度,速度递减是减速度.加速度运动分为两种:匀速加速度和变速运动加速运动和匀速运动的区别:匀速运动是速度大小一致报错不变,加速运动的速度大小会...

    2018-02-09 23:45
    112
  • 十四.2重力,重力加速度,重力加速度运动

    生活中,每时每刻我们都逃脱不了地球对我们的作用力--重力。说到重力,不得不提的东西,那就是重力加速度重力加速度说特殊也特殊,说不特殊,真的一点都不特殊。特殊:是两个物体之间的引力形成不特殊:其实就是个...

    2018-02-10 00:10
    89
  • 十四.2摩擦力

    摩擦力,是指阻碍物品运动的相对作用力。其中摩擦力的方向和物体相对运动方向相反。但是,摩擦力只会让速度的绝对值不断的变小直至0而不会改变它的运动方向。语法:vx*=F;vy*=F;obj.x+=vx;o...

    2018-02-10 00:36
    127
  • CANVAS 变换,transform,rotate,scale,矩阵,css3矩阵,svg矩阵

    本篇文章涉及内容包括: canvas:   translate   rotate   scale  transform(a,b,c,d,e,f),矩阵方法,拓展到SVG和CSS3(代码未提交,待续) ...

    2018-01-28 21:46
    157
  • 八.CANVAS图片像素操作

    CANVAS对图片操作有同源要求,不能跨域,必须在服务器环境 反转颜色: 在线DEMO Document function $$(id){ return d...

    2018-02-03 23:32
    93
  • 十四 。三角函数的运用

    三角函数在canvas中运用极为广泛,常见的用途有 1.两点之间求距离 2.圆周运动 3.波形运动 一,求两点之间的距离 两点之间的距离其实不是三角函数 ,而是勾股定理,不过勾股定理...

    2018-02-04 00:12
    97
  • 七.canvas像素操作

    反转颜色: Document function $$(id){ return document.getElementById(id); } window...

    2018-01-28 19:18
    109
  • 九.CANVAS Math.atan和Math.atan2的区别

    在cavans中,凡是涉及角度都用“弧度”表示,例如180度就应该写成Math.PI,e而360度就该写成Math.PI*2, 在实际开发中,推荐一下写法: 度数*Math.PI/180 CAN...

    2018-01-29 00:29
    112
img博客搬家
img撰写博客
img发布 Chat
img专家申请
img意见反馈
img返回顶部