扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
SpriteJS 是一款由 360 奇舞团开源的跨终端 canvas 绘图库,可以基于 canvas 快速绘制结构化 UI 、动画和交互效果,并发布到任何拥有 canvas 环境的平台上(比如浏览器、小程序和 node )
成都网站制作、网站设计,成都做网站公司-成都创新互联公司已向1000多家企业提供了,网站设计,网站制作,网络营销等服务!设计与技术结合,多年网站推广经验,合理的价格为您打造企业品质网站。
sprite.js 的使用十分简单,就像普通的图形库一样,以官方的 quick start 为例:
"container">
先导入 sprite.js,然后声明一张画布,将其与 id 为 container 的容器绑定,并规定 400*400 的大小。
然后,声明一个精灵对象,从 imgUrl 加载图片设置纹理,其后设置其属性,这些属性名简单易懂,便不赘述了,值得注意的是,sprite 具有图层功能,所以在添加精灵到画布上时,还需要指出图层。
运行的结果如下:
就是在页面左上角显示了一张图片。
注:该项目有中文文档,感兴趣的不妨前去一看。
sprite.js 目前可与 31 款已通过库或其他工具一起使用,下面介绍三种:
1.d3.js(一个用来做数据可视化的 JavaScript 的函数库)
sprite.js 与 d3.js 兼容,可以做出条状图,分层,地图和强制链接
2.Proton(一个轻量级但是强大的JavaScript小引擎)
sprite.js可以和Proton一起做出火焰特效,小的背景和其他你想自定义的东西
3.Matter-js (一个 JavaScript 2D 刚体物理引擎。)
可以做出不同的形状的物体,并一起出现
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流