Have ideas to improve npm?Join in the discussion! »

    gifencoder
    DefinitelyTyped icon, indicating that this package has TypeScript declarations provided by the separate @types/gifencoder package

    2.0.1 • Public • Published

    gifencoder

    Streaming server-side animated (and non-animated) gif generation for node.js

    build status

    Installation

    This module is installed via npm:

    $ npm install gifencoder

    Streaming API - Duplex Piping with Writes

    You can also stream writes of pixel data (or canvas contexts) to the encoder:

    const GIFEncoder = require('gifencoder');
    const encoder = new GIFEncoder(854, 480);
    const pngFileStream = require('png-file-stream');
    const fs = require('fs');
     
    const stream = pngFileStream('test/**/frame?.png')
      .pipe(encoder.createWriteStream({ repeat: -1, delay: 500, quality: 10 }))
      .pipe(fs.createWriteStream('myanimated.gif'));
     
    stream.on('finish', function () {
      // Process generated GIF
    });
     
    // Alternately, you can wrap the "finish" event in a Promise
    await new Promise((resolve, reject) => {
      stream.on('finish', resolve);
      stream.on('error', reject);
    });

    NB: The chunks that get emitted by your read stream must either by a 1-dimensional bitmap of RGBA data (either an array or Buffer), or a canvas 2D context.

    Example: Streaming API - Reads

    You can also use a streaming API to receive data:

    const GIFEncoder = require('gifencoder');
    const { createCanvas } = require('canvas');
    const fs = require('fs');
     
    const encoder = new GIFEncoder(320, 240);
    // stream the results as they are available into myanimated.gif
    encoder.createReadStream().pipe(fs.createWriteStream('myanimated.gif'));
     
    encoder.start();
    encoder.setRepeat(0);   // 0 for repeat, -1 for no-repeat
    encoder.setDelay(500);  // frame delay in ms
    encoder.setQuality(10); // image quality. 10 is default.
     
    // use node-canvas
    const canvas = createCanvas(320, 240);
    const ctx = canvas.getContext('2d');
     
    // red rectangle
    ctx.fillStyle = '#ff0000';
    ctx.fillRect(0, 0, 320, 240);
    encoder.addFrame(ctx);
     
    // green rectangle
    ctx.fillStyle = '#00ff00';
    ctx.fillRect(0, 0, 320, 240);
    encoder.addFrame(ctx);
     
    // blue rectangle
    ctx.fillStyle = '#0000ff';
    ctx.fillRect(0, 0, 320, 240);
    encoder.addFrame(ctx);
     
    encoder.finish();

    The above code will generate the following animated GIF:

    Animated GIF

    Contributing

    gifencoder is an OPEN Open Source Project. This means that:

    Individuals making significant and valuable contributions are given commit-access to the project to contribute as they see fit. This project is more like an open wiki than a standard guarded open source project.

    See the CONTRIBUTING.md file for more details.

    Contributors

    gifencoder is only possible due to the excellent work of the following contributors:

    Kevin Weinerkweiner@fmsware.com
    Thibault Imberthttp://www.bytearray.org/
    Eugene WareGitHub/eugeneware
    Raine VirtaGitHub/raine
    Paul OchoaGitHub/rochoa
    Heikki PoraGitHub/heikkipora

    Install

    npm i gifencoder

    DownloadsWeekly Downloads

    19,856

    Version

    2.0.1

    License

    BSD-3-Clause

    Unpacked Size

    138 kB

    Total Files

    20

    Last publish

    Collaborators

    • avatar
    • avatar
    • avatar
    • avatar