我目前正在研究在新的HTML 5应用程序中使用canvas的选项,并且想知道HTML canvas JavaScript库和框架中当前的最新技术水平是什么？
特别是,是否有框架支持游戏开发所需的东西 - 复杂的动画,管理场景图,处理事件和用户交互？
也愿意考虑商业和开源产品.
我一直在研究fabric.js - 一个画布库来帮助实现这一点 - 通过处理事件和用户交互来操纵画布上的对象.它尚未发布,但请看一个简单的预览演示.
您还可以在最初为其创建的此设计编辑器中查看它.
编辑:该项目现在可以在github上获得(在麻省理工学院许可下开源)
要开始使用,请查看:
演示(简单和复杂,代码显示它们是如何完成的)
FalsyValues的Fabric.js演示文稿(以及BK.js的另一个演示文稿)
Wiki上的github(包括FAQ)
文档
谷歌集团(在那里问任何问题)
Twitter上的Fabric.js(或通过推特发送的简短问题)
Fabric.js简介:第1部分(关于ScriptJunkie的文章)
Fabric.js简介:第2部分(关于ScriptJunkie的文章)
Fabric与其他Javascript画布库相比如何？这是一张比较表.
我很惊讶没有人提到WebGL,以及基于它构建的框架.我会认为它在HTML canvas/javascript上的3D GPU加速图形和复杂动画的最新技术列表中排名很高.
WebGL是一个跨平台,免版税的Web标准,用于基于OpenGL ES 2.0的低级3D图形API,通过HTML5 Canvas元素作为文档对象模型接口公开....
WebGL为网络带来了无插件的3D,直接在浏览器中实现.主要的浏览器供应商Apple(Safari),Google(Chrome),Mozilla(Firefox)和Opera(Opera)都是WebGL工作组的成员.
WebGL对GPU加速图形的支持非常可靠.看看这些GLSL 着色器 演示.:-)并将ChemDoodle视为用户交互的一个示例.
我一直在使用谷歌的O3D框架开发应用程序,该框架管理场景图,并使用WebGL进行渲染(它曾经使用自己的插件).O3D是一项正在进行中的工作,其文档并不完全是最新的,但它正在积极开发中,并且有一些很好的演示.3D游泳池可能是您的最爱.Google开发人员对讨论组中的问题非常敏感.
在WebGL上构建了许多其他框架; 看到这里.提到游戏开发和场景图的人包括Copperlicht,SceneJS,X3DOM.
WebGL运行在几个浏览器的最新开发版本中,但不是IE.我一直在使用Firefox("Minefield")和Chromium,效果很好.您将需要其中一个来运行上述演示.
但是,如果您的要求是它必须没有HTML 5 canvas/js之外的依赖关系,那么WebGL可能不是正确的选择.它看起来并不像IE浏览器将支持它很快.
更新:在遇到很多阻力之后,MS 决定在IE 11中支持WebGL.
三,先生,先生.doob,是javascript的精彩3D引擎,包括scenegraph(软件和WebGL /硬件加速版本),阴影,粒子,皮肤动画(我认为)和灯光效果.看看,他是一个非常有才华的家伙.
我应该补充一点,你将需要最新的谷歌浏览器或同等版本来查看大部分演示,我最喜欢的一个是:http://mrdoob.github.com/three.js/examples/webgl_materials_cars.html
KineticJS是一个崭露头角的图书馆,它拥有在画布上创建和动画个性化"层"的高效性能.
http://www.kineticjs.com/
CAKE.js不再被维护,但是是一个相当强大的框架 - http://code.google.com/p/cakejs/
这里演示- http://glimr.rubyforge.org/cake/canvas.html,http://glimr.rubyforge.org/cake/missile_fleet.html
看一下processingjs框架.即将推出的mootools 2.0版还有使用canvas 的艺术项目
Raphael似乎是一个非常好的画布库; 它是基于SVG的(或基于VML的Internet Explorer),因此支持许多用户输入事件.它相当小(60kb gzip),所以依赖性不是太大.
它似乎也有一个很好的tweener:http://raphaeljs.com/reference.html#animate (见这里和这里的例子).
有关它可以做什么的一个例子,看看这个聪明的小演示.
希望这可以帮助!
京公网安备 11010802040832号 | 京ICP备19059560号-6 