[黑魔法]：canvas的物理动画

这是个人坑,预计会花很长时间来填

坑的坐标pyic-anima

前言： 为什么会想写这个，高中考大学，全靠物理救的命，不然就真的辍学了，大学后因为选择了数媒，学校意外把专业划分给传媒学院，没有了物理课，大学里的方向是游戏(主Unity),也会去蹭影视方向的课，快毕业了，整理了一下自己学的，也算对自己有一个交代吧。

坑的内容有哪些

[√] canvas自定义绘制

[√] vector2支持

[√] tween动画支持

[...] fouce属性进行中

[×] 碰撞检测

[×] IK/FK(动画)

[×] 2d to 3d(在2d上实现不亚于webgl的效果,提升兼容性)

通用： Vector 碰撞检测 动量

运动：tween IK FK

力：弹力 阻力 等对力的支持

3d:View Light 2dto3d Render Animal

后期完成后，应该会支持VUE 小程序等的使用

如何去使用

var obj={
  pro:{//定义对象的坐标与速度
    x:200,y:100,
    vx:0,vy:0
  },
  status:{//其他的属性状态量
    showFlame:false
  },
  draw:function(context){//绘制
  context.save();
  context.fillStyle=' ';
  context.lineWidth = 1;
  context.strokeStyle = "#ffffff";
  context.beginPath();
  context.moveTo(10, 0);
  context.lineTo(-10, 10);
  context.lineTo(-5, 0);
  context.lineTo(-10, -10);
  context.lineTo(10, 0);
  context.stroke();
  if (this.status.showFlame) {
    context.beginPath();
    context.moveTo(-7.5, -5);
    context.lineTo(-15, 0);
    context.lineTo(-7.5, 5);
    context.stroke();
  }
  context.fill();
  context.restore();
  },
  logic:function(){//暂未绑定
  }
};

要绘制的可以独立用js存储起来，再引入进来

var ship = new Sprite(obj);//实例对象
ship.init();//绘制对象

motion

1. uniformspeed:[匀速运动]

obj.v.uniformspeed(obj.pos);

2. changespeed:[变速]

obj.changespeed(obj,a);//a为加速度

moveTo

obj.moveTo(new Vector2(100,100),100,'easeIn');//坐标 时间 运动类型

addFouce

obj.addFouce({x:ax,y:ay},'shunjian')//力,与力的类型

部分功能不是很完善，也有待调整，预计会写很久，整体的结构也在不断调整，最近会把重心放在秋招上，毕竟算上提前批几个月了，还是0offer,心态有点炸

我是山鬼，一个集多种才能于一身的独立爱好者，欢迎给我offer，找我唠嗑。