随笔分类 - 2d
2d游戏
摘要：这部分对原先的缓动函数进行抽象化，并结合缓动公式进行强化。成品的效果非常惊人逆天。走过路过不要错过。 好了，打诨到此为止。普通的加速减速是难以让人满意的，为了实现弹簧等让人眼花缭乱的效果必须动用缓动公式。我见过两套缓动公式，一套是早期Robert Penner大神的缓动公式，内置到tween类中，不
阅读全文
摘要：在讲tween类之前，不得不提的是贝塞尔曲线了。首先，贝塞尔曲线是指依据四个位置任意的点坐标绘制出的一条光滑曲线。它在作图工具或动画中中运用得比较多，例如PS中的钢笔工具，firework中的画笔等等。无论运用在哪里，它们的原理都是一样的。同样，在用js实现运动效果时，我们也可以利用贝塞尔曲线来实现
阅读全文
摘要：tween.js是一款可生成平滑动画效果的js动画库。相关的动画库插件还有：snabbt.js 强大的jQuery动画库插件和Tweene-超级强大的jQuery动画代理插件。 tween.js允许你以平滑的方式修改元素的属性值。你只需要告诉tween你想修改什么值，以及动画结束时它的最终值是什么，
阅读全文
摘要：最近有一个需求，就是当屏幕往下一定像素时，下方会有一个隐藏的模块马上显现出来，向上运动后带有回弹效果。然后屏幕滚回去时这个模块能够原路返回 其实这个效果css3就可以很轻松实现，但是公司要求最低兼容ie7，只能说是无缘了 后来，利用jq的animate也能够实现，但是不知道怎么回事 当滚回去时有延迟
阅读全文
摘要：1.下载box2dweb.直接在页面中引用即可。 -Box2D.js是未压缩版 -Box2d.min.js是压缩版 2.编写HelloWorld代码。
阅读全文
摘要：1 概述 前篇基础文章看完后基本上就应该对box2dweb能上手了，下面来介绍一下box2dweb非常重要的一个概念，关节（joint）也有叫连接器的，总之是一个意思。下面是关节详细的类库说明： BOX2D.Dynamics.Joints>>>动态关节包；b2DistanceJoint 距离连接b2
阅读全文
摘要：简介 大名鼎鼎的物理引擎box2d基本上大家都听说过，网上有两个javascript版本的box2d库，一个时box2djs，已经停止维护，一个是box2dweb。下面就来介绍一下box2dweb的基本信息。 一 包，类介绍 二 创建世界 上面这段代码就创建了一个box2d的世界（Box2D.Dyn
阅读全文
摘要：https://github.com/kripken/box2d.js/ Demo: http://kripken.github.io/box2d.js/webgl_demo/box2d.html 演示: http://kripken.github.io/box2d.js/webgl_demo/bo
阅读全文
摘要：泛洪填充算法(Flood Fill Algorithm) 泛洪填充算法又称洪水填充算法是在很多图形绘制软件中常用的填充算法，最熟悉不过就是 windows paint的油漆桶功能。算法的原理很简单，就是从一个点开始附近像素点，填充成新 的颜色，直到封闭区域内的所有像素点都被填充新颜色为止。泛红填充实
阅读全文
摘要：封闭连通域的图像填充是个常见的算法，最近有机会接触到大图像的例子，做一下总结。 这类问题最基本的算法是种子填充。即先给出封闭区域内的一点，从这点出发搜索邻域，只要不到边界，就把相邻点纳入连通域，赋予填充色。边界的判断比较灵活，可以使用固定颜色，也可以用一定阈值的色彩容差，类似photoshop中的魔
阅读全文
摘要：//定义点的结构体 function point(){ this.x=0; this.y=0; } //计算一个点是否在多边形里,参数:点,多边形数组 function PointInPoly(pt, poly) { for (var c = false, i = -1, l = poly.length, j = l - 1; ++i < l; j = i) (...
阅读全文
摘要：Object.defineProperty 听说vuejs和avalon都是使用这种方式实现的。 Object.defineProperty最早是由IE8实现的，但是IE8的实现有许多问题而且不能hack。。。所以vuejs才支持IE9+，avalon才使用VBScript这个鬼。 我们可以在Obj
阅读全文
摘要：键盘按钮keyCode大全 字母和数字键的键码值(keyCode) 按键键码按键键码按键键码按键键码 A 65 J 74 S 83 1 49 B 66 K 75 T 84 2 50 C 67 L 76 U 85 3 51 D 68 M 77 V 86 4 52 E 69 N 78 W 87 5 53
阅读全文
摘要：在一些复杂的页面中经常会用JavaScript处理一些DOM元素的动态效果，这种时候我们经常会用到一些元素位置和尺寸的计算，浏览器兼容性问题也是不可忽略的一部分，要想写出预想效果的JavaScript代码，我们需要了解一些基本知识。 基础概念 为了方便理解，我们需要了解几个基础概念，每个HTML元素
阅读全文
摘要：已知条件如下： 判断碰撞方法： 1.将矩形ABCD,上下左右4个方向均扩充R的长度,形成新的两个矩形，如果此两个矩形包含圆心坐标则发生碰撞. 2.如果条件1不成立,则仍然有机会发生碰撞,此时发生碰撞的可能存在于矩形ABCD的4个顶点处有可能碰撞, 此时检测根据圆和距离它最近的一个矩形顶点的点到点之间
阅读全文
摘要：一，原理介绍 这回有点复杂，不过看懂了还是很好理解的。当然，我不敢保证这种算法在任何情况下都会起效果，如果有同学测试时，发现出现错误，请及时联系我。 我们首先来建立一个以圆心为原点的坐标系： 然后要检测碰撞就只有两种情况了。 情况一，矩形全部都在一个象限内，如图： 当然，图中只是举个例子，不一定是只
阅读全文
摘要：点和矩形碰撞 矩形碰撞 点(x1,x2) ， 圆心(x2,y2) ，半径r 圆和圆
阅读全文
