Free Trial
10 days, no credit_card

<< More Tutorials

How to convert an image to JPG, GIF, PNG, TIF or WebP in Javascript using rethumb?

To convert an image to JPG, GIF, PNG, TIF or WebP in Javascript use the following code: 

<html>
    <head>
        <script language = "JavaScript">
        window.onload = function()
        {
            var newImage = new Image;
            newImage.onload = function() {
                var imgElement = document.getElementById("img1");
                imgElement.src = this.src;
            }

            // First apply a square operation, then convert to PNG format.

            var paramOperation1 = "square";
            var paramValue1 = 100;

            var paramOperation2 = "format";
            var paramValue2 = "png"; // Other formats available: jpg, gif, tiff and webp.

            var imageURL = "http://images.rethumb.com/image_coimbra_600x300.jpg";

            newImage.src = "http://api.rethumb.com/v1/" + paramOperation1 + "/" + paramValue1 + "/" + paramOperation2 + "/" + paramValue2 + "/" + imageURL;
        }
        </script>
    </head>

    <body>
        <img id="img1">
    </body>
</html>

Start using this example now

Use the following commands to get started:

$ git clone https://github.com/rethumb/rethumb-javascript-examples.git
$ cd rethumb-javascript-examples
$ open format.html

More examples using Javascript

How to use rethumb in Javascript? How to resize an image by width in Javascript using rethumb? How to resize an image by height in Javascript using rethumb? How to resize an image by width and height in Javascript using rethumb? How to create a square thumbnail from an image in Javascript using rethumb? How to read Exif data in json format from an image in Javascript using rethumb? How to read GPS coordinates from an image in Javascript using rethumb? How to convert an image to JPG, GIF, PNG, TIF or WebP in Javascript using rethumb? How to resize an image to cover any dimensions in Javascript using rethumb?

Source code examples at GitHub