Canvas框架createJS组件—EaselJS
CreateJS库是一款HTML5游戏开发的引擎,是一套可以构建丰富交互体验的HTML5游戏的开源工具包,旨在降低HTML5项目的开发难度和成本,让开发者以熟悉的方式打造更具现代感的网络交互体验。掌握了CreateJS可以更方便的完成HTML5的游戏开发。CreateJS提供了EaselJS、TweenJS、SoundJS和PreLoadJS四款工具。EaselJS 库给画布提供了保留图形模式,其中包括一个完整的分层显示列表、一个核心的交互模型以及一个让2D图形在画布上更容易实现的助手类。
我们要做的:
1、 使用 Bitmap 创建图像
2、 使用 [Shape](http://createjs.com/docs/easeljs/classes/Shape.html) 和 [Graphics](http://createjs.com/docs/easeljs/classes/Graphics.html)创建矢量图形
3、 使用 [SpriteSheet](http://createjs.com/docs/easeljs/classes/SpriteSheet.html) 和 [Sprite](http://createjs.com/docs/easeljs/classes/Sprite.html) 创建动态的位图
4、 使用 [Container](http://createjs.com/docs/easeljs/classes/Container.html) 创建保存其他显示对象的容器
所有的显示对象都可以作为子类被添加到舞台(stage)上,或者直接在画布(canvas)上绘制出来。
当使用鼠标或者触摸交互时,除了DOM 元素,所有的显示对象都可以调度事件。EaselJS 支持悬停、按压、释放事件,以及一个容易使用的拖放模块。mouseEvent包括mousedown、mouseenter、mouseleave等。
效果预期:掌握以上功能点可以掌握语音标注平台、图片标注平台的打点、绘图等核心功能逻辑。