Pixaven Blog

Control Image Opacity and Frame Delay With New Parameters

Control Image Opacity and Frame Delay With New Parameters

This week we are bringing two convenient additions to pixel adjustment operations as well as output format settings - opacity and delay. You can now set a global opacity (alpha-transparency) on the resulting image as well as fine-tune the delay between the frames in formats that support animation such as GIF or animated PNG.

Image Opacity

This operation, applied as a last step right before rendering the final image, controls global alpha-transparency. You can now use a new opacity key within the adjust hash that takes a positive float between 0.0 and 1.0:

{
    "adjust": {
        "opacity": 0.75
    }
}

You will find updated API docs and examples for image opacity here.

GIF and APNG Frame Delay

We also extended the output hash with delay parameter which takes a positive float and describes a delay between the frames in formats that support animation - GIF and animated PNG. This effectively controls the speed at which those visuals will be animated when displayed in the browser or app.

{
    "output": {
        "format": "apng",
        "delay": 0.045
    }
}

Please check out updated API docs for animated PNG and GIF output formats.

Here’s a quick example of how to use our newly-introduced controls with our official Node integration:

const Pixaven = require("pixaven");

/**
* Instantiate `pix`
*/

const pix = new Pixaven("your-api-key");

/**
* Upload a file from disk with upload(string) method,
* resize it to a maximum width of 320, set animated PNG as output format,
* adjust opacity to 0.75 and set frame delay to 0.045
*/

pix
    .upload("/srv/storage/animation.gif")
    .resize({
        width: 320
    })
    .adjust({
        opacity: 0.75
    })
    .output({
        format: "apng",
        delay: 0.045
    })
    .toJSON((err, meta) => {
        if (err) {
            return console.log(err);
        }
    });

Should you have questions about those controls or requests for other features do not hesitate to contact us anytime.

About the author

Przemek Matylla is the Founder and CEO of Pixaven currently living in Berlin. You can follow him on Twitter or connect with him on LinkedIn.