HTML5 Canvas JavaScript库 Fabric.js 使用经验
首先,表明我的态度:采用 Flash 才是最优方案,不建议使用 HTML 5 的 Canvas 做一些生产/工业级的网页应用。
Flash的优势一是浏览器支持好,二是代码成熟稳定。而HTML5 的 Canvas 不利用网络上开源的 JS 绘图库,你是不可能做出复制的 Canvas 应用的。而网络中的 JS 绘图库目前杂且乱,部分库没更新几个月项目就被废弃了,现在还没有像 JQuery 之于 JS一样那么流行的 Canvas 绘图库。我看好的就是 Createjs 和 Fabric.js。 其中 Creatjs 包括 3 个 JS库(easeljs,tweenjs,soundjs),各司其职,分别用于Canvas 元素操作、动画特效、声音控制。Fabric.js 则是在矢量图方便特别好用,还有图元的放大、缩小、旋转之类好用。
Frabic.js 在实际使用中发现个明显缺点:定时器不好用,对于做动画特效来说,这很不方便。
Createjs 我只做过Demo,不过定时器设计的很好。翻阅很多论坛,评论说 它的 API 设计很像 Flash 的 ActionScript ,所以对于以前使用 Flash 开发的人来说,它很适合。由于我不会 AS ,感觉不到这点。
后面会有我使用 Fabric.js 做的一些很浅陋的应用。
PS: CreateJS 目前已经有 Adobe 之类的大厂商赞助,并且目前可以用CC导出,看来会成为下一波流行(Canvas JS库)的主流。
HTML5 Canvas JavaScript库 Fabric.js 使用经验的更多相关文章
- Canvas实用库Fabric.js使用手册
简介什么是Fabric.js? Fabric.js是一个可以简化Canvas程序编写的库. Fabric.js为Canvas提供所缺少的对象模型, svg parser, 交互和一整套其他不可或缺的工 ...
- 超酷HTML5 Canvas图表应用Chart.js自定义提示折线图
超酷HTML5 Canvas图表应用Chart.js自定义提示折线图 效果预览 实例代码 <div class="htmleaf-container"> <div ...
- 高性能动画!HTML5 Canvas JavaScript框架KineticJS
高性能动画!HTML5 Canvas JavaScript框架KineticJS KineticJS是一款开源的HTML5 Canvas JavaScript框架,能为桌面和移动应用提供高性能动画,并 ...
- Chart.js – 效果精美的 HTML5 Canvas 图表库
Chart.js 是一个令人印象深刻的 JavaScript 图表库,建立在 HTML5 Canvas 基础上.目前,它支持6种图表类型(折线图,条形图,雷达图,饼图,柱状图和极地区域区).而且,这是 ...
- 基于html5 Canvas图表库 : ECharts
ECharts开源来自百度商业前端数据可视化团队,基于html5 Canvas,是一个纯Javascript图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表.创新的拖拽重计算.数据视图.值 ...
- 自己写的HTML5 Canvas + Javascript五子棋
看到一些曾经只会灌水的网友,在学习了前端之后,已经能写出下载量几千几万的脚本.样式,帮助大众,成为受欢迎的人,感觉满羡慕的.我也想学会前端技术,变得受欢迎呀.于是心血来潮,开始学习前端知识,并写下了这 ...
- 二维码生成:使用 JavaScript 库QRCode.js生成二维码
QRCode.js:跨浏览器的javascript二维码生成库,支持html5的Canvas画布,没有任何依赖. Github 地址:https://github.com/davidshimjs/qr ...
- 【JavaScript游戏开发】使用HTML5+Canvas+JavaScript 封装的一个超级马里奥游戏(包含源码)
这个游戏基本上是建立在JavaScript模块化的开发基础上进行封装的,对游戏里面需要使用到的游戏场景进行了封装,分别实现了Game,Sprite,enemy,player, base,Animati ...
- 二维码解析:使用 JavaScript 库reqrcode.js解析二维码
上次使用QRCode.js可以来生成二维码,但是我没有找到有文档说明可以对存在的二维码进行扫描解析其中的内容. 幸亏查找到了可行的解决方案,而且很好使哦!就是reqrcode.js 地址:https: ...
随机推荐
- PHP 时间函数集合
计算指定日期的前几天,几个月或者几年的函数 $a = '2014/08/21';echo date( "Y-m-d", strtotime( "-6 month &qu ...
- Java SE (2)之 Graphics 画图工具
Graphics 绘图类: 提供两个方法.Paint (绘图,被系统自动调用) repaint(重绘) Paint 调用原理(1.窗口最大化,再最小化 窗口的大小发生变化 Repaint函数被调 ...
- 使用linq获得当前文件夹下的下一级满足条件的文件夹
使用linq获得当前文件夹下的下一级满足条件的文件夹. SPFolderCollection subAlbums = Folder.SubFolders; ...
- C#基础加强
1.代码规范 -命名规范:定义的变量或者方法名要有意义. 1.骆驼命名 :第一个单词首字母小写,之后的单词首字母大写 userName.userPassword.realName…(普通变量(局部变量 ...
- python基础知识九
sys模块 sys模块包含系统对应的功能.我们已经学习了sys.argv列表,它包含命令行参数. 命令行参数 例14.1 使用sys.argv #!/usr/bin/python # Filename ...
- BroadcastReceiver和Intetnt的理解 Day34
BroadcastReceiver和Intetnt的理解 Day34 mobile4.0 短信监控 问题堆栈 1. 下载开源项目View.网址自己fork一下 2. ContentProvider原理 ...
- Mybatis的学习总结二:使用Mybatis对表进行CRUD操作【参考】
一.使用Mybatis对表进行CRUD操作------基于XML的实现 1.定义SQL的映射文件 2.在conf.xml中进行注册. 2.创建测试类 [具体过程参考:Mybatis的学习总结一] 二. ...
- LInkedList集合练习
package com.java.linkedlist; import java.util.LinkedList; /* * LinkedList类的特点:查询速度慢,增删速度快. * LinkedL ...
- Windows phone 之手势识别(Drag)
首先,在XAML页面中,添加如下代码: 前提,别忘了添加 1.引入dll (silverlight for wndows phone toolkit) 2.引入命名空间 xmlns:toolkit=& ...
- gocode 安装
1.安装git,将git/bin添加至PATH 2.执行go get -u github.com/nsf/gocode 3.在%GOPATH%/bin/下会生成gocode.exe