How to Swirl Distort an Image with JavaScript

If your social app allows users to upload photos, then photo-filter APIs are a must-have. Filters allow people to make slight customizations to their images, distinguishing them in simple, pre-set ways. Our Swirl Distort API is one such photo-filter option, rotating the pixels within an image based on a specified number of degrees. It’s easy to use, and you can take advantage of it by structuring your API call based on the below JavaScript code examples.

To get started, first install the jQuery library. Run the below command:

bower install jquery

Once that’s done, let’s add in our callback function. Note that the first snippet captures your image file, and your Cloudmersive API key (obtainable by registering a free account on our website) fits in where it says “YOUR-API-KEY-HERE”:

var form = new FormData();
form.append("imageFile", fileInput.files[0], "file");
var settings = {
     "url": "https://api.cloudmersive.com/image/filter/swirl?degrees=<integer>",
     "method": "POST",
     "timeout": 0,
     "headers": {
          "Content-Type": "multipart/form-data",
          "Apikey": "YOUR-API-KEY-HERE"
     },
     "processData": false,
     "mimeType": "multipart/form-data",
     "contentType": false,
     "data": form
};
$.ajax(settings).done(function (response) {
     console.log(response);
});