生成GIF动画的JS库：gif.js
jopen
10年前
gif.js 是一个GIF编码库，可用于直接在中浏览器生成GIF图片。使用typed arrays和web workers 在后台渲染每一帧，它真的很快！
示例 - http://jnordberg.github.io/gif.js/
可工作在支持： Web Workers, File API 和 Typed Arrays的浏览器中。
经测试支持：
- Google Chrome
- Firefox 17
- Safari 6
- Internet Explorer 10
- Mobile Safari iOS 6
用法
Include gif.js found in dist/ in your page. Also make sure to have gif.worker.js in the same location.
var gif = new GIF({ workers: 2, quality: 10 }); // add an image element gif.addFrame(imageElement); // or a canvas element gif.addFrame(canvasElement, {delay: 200}); // or copy the pixels from a canvas context gif.addFrame(ctx, {copy: true}); gif.on('finished', function(blob) { window.open(URL.createObjectURL(blob)); }); gif.render(); 选项
Options can be passed to the constructor or using the setOptions method.
| Name | Default | Description |
|---|---|---|
| repeat | 0 | repeat count, -1 = no repeat, 0 = forever |
| quality | 10 | pixel sample interval, lower is better |
| workers | 2 | number of web workers to spawn |
| workerScript | gif.worker.js | url to load worker script from |
| background | #fff | background color where source image is transparent |
| width | null | output image width |
| height | null | output image height |
| transparent | null | transparent hex color, 0x00FF00 = green |
If width or height is null image size will be deteremined by first frame added.
addFrame options
| Name | Default | Description |
|---|---|---|
| delay | 500 | frame delay |
| copy | false | copy the pixel data |