Calls should be made as POST requests to this entry point:
https://imgscatter.vercel.app/scatter
You need to encode your image (either an URL or locally uploaded) as FormData. Append it as "image", and the pass the new FormData as the body of the POST request. Please note that the image should be less than 1mb.
These can be included either as an URL query, or as an Object which you can append as "query" into the FormData.
| query | value | effect |
|---|---|---|
| grid | integer | amount of slices to divide the image into |
| style | scatter | basic effect, slices the image n times and randomizes the result in a grid. |
| begotten | like the cult classic 1990 horror film | |
| ripples | edges spreading out on a surface | |
| ultrawave | corrupted beams of light | |
| ride | psychedelic image degradation | |
| repeat | boolean | decide if the slices will be repeated during the compositing process |
| Note that parameters not included on the API call will be defaulted to a 2x2 grid with the scatter style and no repetition. | ||
| examples | |
|---|---|
| URL query | https://imgscatter.vercel.app/scatter?grid=2&style=ride&repeat=false |
| object | {grid: 6, style: ultrawave, repeat: true} |
| If you are using this method, remember to JSON.stringify() when you append it to FormData. | |
async function getImage() {
const sendForm = new FormData();
sendForm.append("image", "https://exampleimage.com");
const query = {grid: 5, style: "ride", repeat:false};
sendForm.append("query", JSON.stringify(query));
const response = await fetch("https://imgscatter.vercel.app/scatter",
{
method: "POST",
body: sendForm
}
);
//Then you can do as you wish with the response, for example
const data = await response.text();
//and then set this as the source in a DOM element
//to display the resulting image.
}