Image Vectorization – Aspose.HTML Cloud

This article explains how to vectorize raster images using Aspose.HTML Cloud API from URL sources in synchronous and asynchronous modes. Supported image formats for vectorization include PNG, JPEG, JPG, BMP, GIF, and WEBP. The vectorized files are always produced in SVG format.

Before starting, ensure you have obtained an authorization token. Refer to the Authorization Guide for details.

Vectorization Methods

Aspose.HTML Cloud provides two vectorization methods:

Synchronous Vectorization: Ideal for smaller images; the result is directly returned in the response.
Asynchronous Vectorization: Best suited for larger images; the task runs in the background, and the result is downloaded upon completion.

1. Synchronous Vectorization

Endpoint: POST https://api.aspose.cloud/v4.0/html/vectorization/png/sync

Authorization: Bearer token

Request Body:

1{
2    "InputPath": "https://example.com/image.png",
3    "Options": {
4        "ErrorThreshold": 30,
5        "MaxIterations": 100,
6        "ColorLimit": 16,
7        "LineWidth": 1.5
8    }
9}

Response: The API returns the vectorized SVG file directly.

 1using System;
 2using System.IO;
 3using System.Net.Http;
 4using System.Net.Http.Headers;
 5using System.Text;
 6using System.Threading.Tasks;
 7
 8public async Task VectorizeImageSync()
 9{
10    using (HttpClient client = new HttpClient())
11    {
12        client.DefaultRequestHeaders.Authorization = new AuthenticationHeaderValue("Bearer", "YOUR_ACCESS_TOKEN");
13        var requestBody = new StringContent(
14            "{\"InputPath\": \"https://example.com/image.png\", \"Options\": {\"ErrorThreshold\": 30, \"MaxIterations\": 100, \"ColorLimit\": 16, \"LineWidth\": 1.5}}",
15            Encoding.UTF8, "application/json");
16        var response = await client.PostAsync("https://api.aspose.cloud/v4.0/html/vectorization/png/sync", requestBody);
17        var fileStream = await response.Content.ReadAsStreamAsync();
18        using (FileStream fs = new FileStream("output.svg", FileMode.Create))
19        {
20            await fileStream.CopyToAsync(fs);
21        }
22    }
23}

JavaScript

 1async function vectorizeImageSync() {
 2    const url = "https://api.aspose.cloud/v4.0/html/vectorization/png/sync";
 3    const requestBody = JSON.stringify({
 4        InputPath: "https://example.com/image.png",
 5        Options: { ErrorThreshold: 30, MaxIterations: 100, ColorLimit: 16, LineWidth: 1.5 }
 6    });
 7    const response = await fetch(url, {
 8        method: 'POST',
 9        headers: {
10            'Authorization': 'Bearer YOUR_ACCESS_TOKEN',
11            'Content-Type': 'application/json'
12        },
13        body: requestBody
14    });
15    const blob = await response.blob();
16    const a = document.createElement('a');
17    a.href = URL.createObjectURL(blob);
18    a.download = 'output.svg';
19    a.click();
20}

2. Asynchronous Vectorization

Steps:

Submit vectorization request
Check vectorization status
Download the vectorized file

1// Submit vectorization request
2var requestBody = new StringContent(
3    "{\"InputPath\": \"https://example.com/image.png\", \"OutputFile\": \"vectorized.svg\", \"Options\": {\"ErrorThreshold\": 30}}",
4    Encoding.UTF8, "application/json");
5
6// Use similar logic as shown in synchronous example to submit request, check status, and download file.