### HTML Structure for 360° Image Spinner

Source: https://docs.imagin.studio/api-integration/manuals/360-example

Defines the HTML elements for a 360° image viewer. Includes an input range slider for angle selection and a div to hold the image elements. No external dependencies are required for this HTML structure.

```html
<input type="range" min="0" value="0" class="slider" id="angleSlider" />
<div id="imagesContainer" />
```

--------------------------------

### JavaScript 360° Image Spinner Logic

Source: https://docs.imagin.studio/api-integration/manuals/360-example

Implements the core logic for a 360° image spinner using JavaScript. It fetches images from a CDN based on provided angles and updates the display via a slider input. Requires a customer ID and specific CDN URL parameters.

```javascript
// Setup
const customerId = "your-customer-id";

// Example url for the Abarth 124-spider
const cdnUrl = `https://cdn.imagin.studio/getImage?customer=${customerId}&make=abarth&modelFamily=124-spider&modelRange=124-spider&modelVariant=ca&bodySize=2&modelYear=2018`;
const angles = ["200", "201", "202", "203", "204", "205", "206", "207", "208", "209", "210", "211", "212", "213", "214", "215", "216", "217", "218", "219", "220", "221", "222", "223", "224", "225", "226", "227", "228", "229", "230", "231"];

// Select elements
const sliderElement = document.getElementById("angleSlider");
const imagesContainerElement = document.getElementById("imagesContainer");
const images = [];


// Initialization
const init = () => {
		
    // clear the images array
    images.length = 0;
    
    // create the images
    angles.reverse().forEach((angle, index) => {
      const img = document.createElement("img");
      img.src = `${cdnUrl}&angle=${angle}`;
      img.classList.add("image");
      if (index === 0) {
	      img.classList.add("current");
      }
      images.push(img);
    	imagesContainerElement.appendChild(img);
    });
    sliderElement.setAttribute("max", angles.length -1);
    sliderElement.oninput = (e) => {
    	handleUpdate(e.currentTarget.value);
    };
};

const handleUpdate = (value) => {
		const intValue = parseInt(value, 10);
		images.forEach((image, index) => {
    	if (index === intValue) {
      	image.classList.add("current");
      } else {
      	image.classList.remove("current");
      }
    });
};

init();
```

--------------------------------

### Imagin Studio CDN API Signed URL Generation

Source: https://docs.imagin.studio/api-integration/manuals/creating-a-signedurl

This section details the process of generating a signed URL for the Imagin Studio CDN. It involves obtaining API credentials (customerId and customerSecret), constructing a GET request to the `getSignedUrl` endpoint with specific parameters, and including a Base64 encoded `Authorization` header for authentication. The final signed URL is then used to access CDN resources.

```APIDOC
API Endpoint:
GET https://cdn.imagin.studio/getSignedUrl

Parameters:
- make: (string) The make of the vehicle (e.g., 'audi')
- modelFamily: (string) The model family of the vehicle (e.g., 'a4')

Authorization Header:
Authorization: Basic <base64_encoded_credentials>

Base64 Encoding:
Encode your 'customerId:customerSecret' string. For example, 'abc123:xyz987' becomes 'YWJjMTIzOnh5ejk4Nw=='.

Example Request URL:
https://cdn.imagin.studio/getSignedUrl?make=audi&modelFamily=a4

Example Authorization Header:
Authorization: Basic YWJjMTIzOnh5ejk4Nw==

Final URL Structure:
https://cdn.imagin.studio/{signedURL}
```

--------------------------------

### CSS Styling for 360° Image Spinner

Source: https://docs.imagin.studio/api-integration/manuals/360-example

Styles the 360° image viewer components. Positions images absolutely within a container and controls their visibility to create a spinning effect. Ensures only the currently selected image is visible at any time.

```css
#imagesContainer {
  position: relative;
}

img.image {
  position: absolute;
  visibility: hidden;
  max-width: 300px;
}
img.image.current {
  visibility: visible;
}
```

--------------------------------

### GET /getPaints API Endpoint

Source: https://docs.imagin.studio/api-integration/apis

Fetches paint information from the Imagin Studio API. This endpoint provides details about available paint options.

```APIDOC
GET /getPaints
  Description: Fetches paint information.
  Source: https://cdn.imagin.studio/meta/openapi.yaml
  Parameters:
    (Query Parameters are expected based on OpenAPI specification, but not detailed here)
  Returns:
    (Paint data or related information, based on OpenAPI specification)
```

--------------------------------

### Imagin Studio Image CDN API

Source: https://docs.imagin.studio/guides/getting-images/selecting-a-car

The Imagin Studio CDN provides an API to fetch specific car images based on a wide range of vehicle attributes. Providing detailed parameters ensures accurate image selection and a better user experience. The service uses machine learning to adapt and learn from new data, improving results over time.

```APIDOC
Imagin Studio Image CDN API:
  Endpoint: https://cdn.imagin.studio/getImage

  Description:
    Fetches car images from the Imagin Studio CDN. The service dynamically adapts and learns from new data to optimize delivery and improve results.

  Parameters:
    customer (string, required): Your unique customer key.
    make (string, required): The manufacturer of the vehicle (e.g., 'toyota', 'vw').
    modelFamily (string, required): The primary model name (e.g., 'corolla', 'id-buzz').
    modelRange (string, optional): A specific range or trim level of the model (e.g., 'corolla-gr').
    modelVariant (string, optional): A specific variant code or identifier (e.g., 'ha' for hatchback, 'pv' for passenger van).
    modelYear (string, optional): The model year of the vehicle (e.g., '2023'). Defaults to the latest available.
    powerTrain (string, optional): The type of powertrain (e.g., 'petrol', 'hybrid').
    angle (string, optional): The camera angle for the image (e.g., '23'). Defaults to '01'.
    paintid (string, optional): The identifier for the paint color (e.g., 'imagin-red').
    zoomtype (string, optional): The zoom behavior for the image ('relative', 'fullscreen'). Defaults to 'relative'.
    groundPlaneAdjustment (string, optional): Adjustment for the ground plane in the image. Defaults to '0'.

  Usage Notes:
    - Do not provide 'default' or 'unknown' values; omit the attribute instead.
    - If a perfect match is not found, the CDN will provide the closest match and update it as data is learned.
    - For exact vehicle configurations, use the Imagin Studio Dashboard to copy URLs.

  Example 1 (Basic):
    https://cdn.imagin.studio/getImage?customer=img-test&make=toyota&modelFamily=corolla

  Example 2 (Specific):
    https://cdn.imagin.studio/getImage?customer=img-test&make=toyota&modelFamily=corolla&modelRange=corolla-gr&modelVariant=ha&modelYear=2023&powerTrain=petrol&angle=23&paintid=imagin-red&zoomtype=fullscreen

  Example 3 (Alternative Naming):
    make=vw&modelFamily=id-buzz-cargo
    (instead of make=volkswagen&modelFamily=id-buzz&modelVariant=pv)

  Related Resources:
    Contact: https://www.imaginstudio.com/contact
    Dashboard: https://dashboard.imagin.studio/dashboard
```

--------------------------------

### GETPAINTSWATCHES API for Color Swatches

Source: https://docs.imagin.studio/guides/getting-images/setting-up-color-swatches

This API provides the color information necessary to create paint tiles or color swatches. You can retrieve your provided paint data using the `paintId` to generate these visual representations.

```APIDOC
GETPAINTSWATCHES
  Description: Retrieves color information for creating paint tiles/color swatches.
  Purpose: Allows fetching provided paint data by `paintId` to generate paint tiles.
  Parameters:
    paintId (string): Identifier for the specific paint data to retrieve.
  Returns:
    JSON object containing color information for paint swatches.
  Notes:
    - Paint availability can vary by country and vehicle model.
    - Product codes may differ for the same paint.
    - Data accuracy is crucial for seamless mapping and service functionality.
```

--------------------------------

### Set Referer Header in Java API Call (Android)

Source: https://docs.imagin.studio/guides/getting-images/embedding-in-your-mobile-app

Provides an example of setting the 'Referer' header in Java for Android applications using HttpURLConnection. This helps in identifying the source of API requests for security and analytics purposes.

```java
URL url = new URL("https://cdn.imagin.studio/getImage?customer=yourCustomerValue");
// Add more query parameters as needed
HttpURLConnection connection = (HttpURLConnection) url.openConnection();
connection.setRequestMethod("GET");
connection.setRequestProperty("Referer", "https://myapp.com");

// Handle response
InputStream inputStream = connection.getInputStream();
// ...
```

--------------------------------

### GET /getPaintswatches API Endpoint

Source: https://docs.imagin.studio/api-integration/apis

Retrieves paint swatch data from the Imagin Studio API. This endpoint is used to get visual representations of paint colors.

```APIDOC
GET /getPaintswatches
  Description: Retrieves paint swatch data.
  Source: https://cdn.imagin.studio/meta/openapi.yaml
  Parameters:
    (Query Parameters are expected based on OpenAPI specification, but not detailed here)
  Returns:
    (Paint swatch data or related information, based on OpenAPI specification)
```

--------------------------------

### GET /getImage API Endpoint

Source: https://docs.imagin.studio/api-integration/apis

Retrieves image data from the Imagin Studio API. This endpoint is part of the core image handling functionality.

```APIDOC
GET /getImage
  Description: Retrieves image data.
  Source: https://cdn.imagin.studio/meta/openapi.yaml
  Parameters:
    (Query Parameters are expected based on OpenAPI specification, but not detailed here)
  Returns:
    (Image data or related information, based on OpenAPI specification)
```

--------------------------------

### CDN API Connection and Authorization

Source: https://docs.imagin.studio/api-integration/manuals/connecting-to-backend-cdn-api-methods

Details the steps to authenticate and interact with the CDN API. This includes obtaining API credentials, constructing HTTP requests with the correct Authorization header, and understanding parameter handling.

```APIDOC
CDN API Connection and Authorization:

This documentation outlines the process for connecting to the backend CDN API, including authentication and request formulation.

1. Obtain API Credentials:
   - Requires a "customerId" (username) and "customerSecret" (password).
   - These are found in the dashboard.

2. Formulate API Request:
   - Prepare requests with necessary parameters, headers, and payload.
   - Example Endpoint:
     GET https://cdn.imagin.studio/getSignedUrl?customer={customer-key}&make=audi&modelFamily=a4
     - Parameters:
       - customer: Your CDN API customer ID (ignored if present in query string, see note below).
       - make: The make of the vehicle (e.g., 'audi').
       - modelFamily: The model family (e.g., 'a4').

3. Include Authorization Header:
   - The Authorization header is mandatory for authentication.
   - Format: `Authorization: Basic <base64-encoded-credentials>`
   - To create the value:
     a. Concatenate your "customerId" and "customerSecret" with a colon: `customerId:customerSecret`.
     b. Base64 encode the resulting string.
   - Example:
     - If customerId="abc123" and customerSecret="xyz987", the string is "abc123:xyz987".
     - Base64 encoding "abc123:xyz987" yields "YWJjMTIzOnh5ejk4Nw==".
     - The header should be: `Authorization: Basic YWJjMTIzOnh5ejk4Nw==`.

4. Send the Request:
   - Send the HTTP request with the Authorization header.
   - Note on Query Parameters:
     - The CDN API will ignore any `customer=` parameters supplied in the query string of the request.
```

--------------------------------

### IMAGIN.studio API Endpoints

Source: https://docs.imagin.studio/api-integration/manuals/getting-started

Lists the primary API endpoints available through the IMAGIN.studio CDN for retrieving automotive imagery and related data. Each API operates on a subset of generic attributes.

```APIDOC
Available APIs:

1. /getImage
   - Purpose: Retrieves unique images from the CDN.
   - Usage: Primarily used for fetching product imagery based on provided data points.
   - Reference: [read more](getimage-api-behavior-and-timing)

2. /getPaintSwatches
   - Purpose: Retrieves color information for creating color tiles (swatches).
   - Usage: Grants a Micro Use License to the end user for single download/use of returned data per session.
   - Reference: [read more](../paint-data-and-api-behavior#getpaintswatches)
```

--------------------------------

### GET /getCarListing API Endpoint

Source: https://docs.imagin.studio/api-integration/apis

Fetches car listing details from the Imagin Studio API. This endpoint provides information about vehicles available for listing.

```APIDOC
GET /getCarListing
  Description: Fetches car listing details.
  Source: https://cdn.imagin.studio/meta/openapi.yaml
  Parameters:
    (Query Parameters are expected based on OpenAPI specification, but not detailed here)
  Returns:
    (Car listing data or related information, based on OpenAPI specification)
```

--------------------------------

### Image Generation Parameters

Source: https://docs.imagin.studio/api-integration/manuals/cdn-data-points

Defines the core parameters for controlling image output, including format, transparency, and optimization. It also covers safety features and image dimensions, with specific notes on resolution scaling and quality trade-offs.

```APIDOC
type:
  description: The type of image you wish to receive. PNG's and WEBP are transparent. All file types are web optimized.
  values: ["webp*", "jpeg", "png*"]
  default: "png"

safeMode:
  description: Enables or disables safemode. Safemode protects the object in the image from being cut-off when being manipulated through zoomType, zoomLevel or groundPlaneAdjustment.
  values: ["true", "false"]
  default: "true"

width:
  description: The width of the image you wish to receive. Any requested width is resolved back to the first larger standard CDN size. For example 745 returns 800. All sizes are web optimized except for 3456, which offers with highest quality possible disregarding file size.
  values: [150, 400, 800, 1200*, 1600*, 2600*, 3456*]
  default: 800

margins:
  description: Range in % of width and height of margins around the usable area of the image. Defaults to 0.02 (2%).
  constraints: "Range of 0 to 0.4"
  default: 0.03
```

--------------------------------

### IMAGIN.studio CDN Base URL Structure

Source: https://docs.imagin.studio/api-integration/manuals/getting-started

Details the standard format for making requests to the IMAGIN.studio Content Delivery Network (CDN). This structure is used across all available APIs to fetch specific content.

```APIDOC
https://{cdn-instance}.imagin.studio/{api-name}?customer={customer-key}&{query parameters}

Parameters:
- cdn-instance: Specifies the CDN instance to use (e.g., 'cdn', 'cdn-01' to 'cdn-09'). Defaults to 'cdn'.
- api-name: The specific API endpoint being accessed (e.g., '/getImage', '/getPaintSwatches').
- customer-key: Your unique customer identifier, required for all requests.
- query parameters: Data points used to match and retrieve specific images or data. More parameters lead to more accurate results.
```

--------------------------------

### Embed Referer with Axios

Source: https://docs.imagin.studio/api-integration/manuals/embedding-a-referer

Demonstrates how to embed a referer header in HTTP requests using the axios JavaScript library. It shows creating an axios instance with a base URL and making a GET request with a custom 'Referer' header, handling potential errors.

```javascript
import axios from 'axios';

// Create Axios instance with baseURL
const axiosInstance = axios.create({ baseURL: 'https://cdn.imagin.studio/getImage?customer=yourCustomerValue' });

// Function to fetch data with custom referrer header
const fetchData = async () => {
  try {
    const response = await axiosInstance.get('/data', { headers: { 'Referer': 'https://myapp.com' } });
    console.log('Data:', response.data);
  } catch (error) {
    console.error('Error fetching data:', error);
  }
};

// Example usage
fetchData(); // Make a GET request with custom referrer header
```

--------------------------------

### Set Referer Header in Flutter API Call

Source: https://docs.imagin.studio/guides/getting-images/embedding-in-your-mobile-app

Illustrates how to include the 'Referer' header in API requests made with the 'http' package in Flutter. This practice enhances request traceability and can be used for security validation.

```dart
import 'package:http/http.dart' as http;

var url = Uri.parse('https://cdn.imagin.studio/getImage?customer=yourCustomerValue');
// Add additional query parameters here
var response = await http.get(url, headers: {'Referer': 'https://myapp.com'});
print('Response status: ${response.statusCode}');
```

--------------------------------

### IMAGIN Studio Car Configuration Parameters

Source: https://docs.imagin.studio/api-integration/manuals/cdn-data-points

Defines the data points used to specify car make, model, variants, paint, rims, and viewing angles. These parameters are crucial for tailoring the car image generation process.

```APIDOC
IMAGIN_STUDIO_API_PARAMETERS:
  customer:
    description: Your customer key, as given to you by IMAGIN.studio. This key defines tailoring and billing structures.
    type: string
    required: true
  tailoring:
    description: Your tailoring key. Tailoring controls the logo shown on the license plate.
    type: string
    required: false
  make:
    description: The make/brand of the car you are requesting.
    type: string
    required: true
    example: "audi"
  modelFamily:
    description: The model of the car you are requesting.
    type: string
    required: true
    example: "a3"
  modelRange:
    description: Key to differentiate special model lines such as Audi S, BMW M, Mercedes AMG, etc.
    type: string
    required: false
    example: "rs3"
  modelVariant:
    description: The type of the body of the car you are requesting.
    type: string
    required: false
    possible_values: ["hatchback", "sedan", "estate", "mpv", "suv", "convertible", "coupe", "targa", "pickup", "closed-cabin", "double-cabin", "passenger-cabin"]
    example: "suv"
  powerTrain:
    description: Specifies the drive type of the car.
    type: string
    required: false
    example: "phev"
  bodySize:
    description: Specifies the car's body size. For passenger vehicles you specify the number of doors. For commercial vehicles this attribute is used to specify the height and length of the vehicle (L1H2).
    type: string | integer
    required: false
    example: 5
  modelYear:
    description: The year of introduction of the model or facelift. Trims are classified by the introduction year of the first trim launched, not the trim itself. The CDN will look for a car that is equal or older than the year requested.
    type: integer
    required: false
    example: 2024
  trim:
    description: Only the name of the trim / edition you are requesting. Stripped from any engine, powertrain or other data. Trim requests that include other data than trim name might be misunderstood.
    type: string
    required: false
    example: "business-edition"
  paintId:
    description: Only the product id / product code of the paint option you wish to receive. PaintId's containing paint descriptions, rgb values or any information other than the product option code might be misunderstood.
    type: string
    required: false
    example: "2t"
  paintDescription:
    description: The description of the paint you have requested with the paint id. The paint's description provides essential information as, if the paintId can not be resolved, this property is used to aid the research to the requested paintId. When omitted no research can be done to research an unresolvable paint id. The "paintDescription" should not be used on its own and should always be associated with a "paintID".
    type: string
    required: false
    example: "brilliant-black-metallic"
  randomPaint:
    description: By adding the &randomPaint=true datapoint to the URL, a random paint (color) will be assigned to the requested vehicle.
    type: boolean
    required: false
    possible_values: [true, false]
    example: true
  rimId:
    description: Not yet available. The product id / product code of the rim option you wish to receive. rimId's containing product descriptions, sizing values or any information other than the product option code might be misunderstood.
    type: string
    required: false
    example: "cg0"
  rimDescription:
    description: Not yet available. The product description of the rim you have requested with the rimId. If when the description is omitted the request will be ignored.
    type: string
    required: false
    example: "wheels-17-inch-cast-aluminum-\"5-w-spoke\"-design"
  angle:
    description: Specifies the viewpoint of the camera.
    type: integer | string
    required: false
    example: 21
    reference: "https://docs.imagin.studio/guides/getting-images/selecting-angles"
  zoomType:
    description: Controls how the car is displayed within the viewer.
    type: string
    required: false
    possible_values: ["relative", "fullscreen", "adaptive"]
    example: "fullscreen"
    notes: |
      - Fullscreen: The viewer maximizes the car's size to fill the display area.
      - Relative: (Default on standard angles) Sizes are consistent across different car models.
      - Adaptive: (Default on 360 spinner) Maximizes display size while maintaining proportional accuracy across all angles.
  zoomLevel:
    description: Dictates how magnified a vehicle appears on the canvas. Increasing it enlarges the vehicle, while decreasing it shrinks it. Irrelevant when zoomType is fullscreen.
    type: integer
    required: false
    range: "0 -> 10 -> 30"
    example: 15
  groundPlaneAdjustment:
    description: Decimal point percentage to change the position where the car wheels touch the ground. An automated offset may be applied to your settings.
    type: number
    required: false
    range: "-1 -> 0.08 -> 1"
    example: -0.07
  fileType:
    description: Specifies the desired output file format for the generated image.
    type: string
    required: false
    example: "png"
```

--------------------------------

### Set Referer Header in Swift API Call

Source: https://docs.imagin.studio/guides/getting-images/embedding-in-your-mobile-app

Demonstrates how to set the 'Referer' HTTP header for an API request in Swift using URLSession. This is crucial for mobile apps to track the origin of requests, aiding in security and analytics.

```swift
var urlComponents = URLComponents(string: "https://cdn.imagin.studio/getImage")
urlComponents?.queryItems = [
    URLQueryItem(name: "customer", value: "yourCustomerValue")
]
// Add more query items as needed

var request = URLRequest(url: (urlComponents?.url)!)
request.httpMethod = "GET"
request.setValue("https://myapp.com", forHTTPHeaderField: "Referer")

let task = URLSession.shared.dataTask(with: request) { (data, response, error) in
    // Handle response here
}
task.resume()
```

--------------------------------

### Imagin Studio Image Generation API

Source: https://docs.imagin.studio/guides/getting-images/selecting-our-lifestyle-images

Demonstrates how to generate car images with specific lifestyle surroundings and viewpoints using the Imagin Studio API. The API allows customization of the vehicle's environment and camera perspective by specifying 'surrounding' and 'viewPoint' parameters.

```APIDOC
API Endpoint: https://cdn.imagin.studio/getImage

Functionality: Generate car images with customizable lifestyle surroundings and viewpoints.

Key Parameters:
- surrounding: Specifies the lifestyle scene for the vehicle. Available options include 'sur1' (Mediterranean Village Square), 'sur2' (Wihte Hall), 'sur3' (Sunset House), 'sur4' (Desert Rock), 'sur5' (Warehouse), 'sur6' (Tundra Drive), and 'su21' (Brick House).
- viewPoint: Selects the camera perspective for the scene. Each surrounding offers multiple viewpoints (e.g., viewpoint 1, 2, 3).

Example Usage:
This API is typically used within an HTML `<img>` tag. The URL includes various parameters to define the vehicle and its presentation.

Example 1: Mediterranean Village Square
URL: https://cdn.imagin.studio/getImage?customer=img-test&make=ford&modelFamily=mustang-gt&modelVariant=es&bodySize=2&modelYear=2024&powerTrain=petrol&trim=eu&paintId=imagin-grey&zoomType=fullscreen&width=1200&surrounding=sur1&viewPoint=1&aspectRatio=32:9&overlayArea=none

Example 2: Wihte Hall
URL: https://cdn.imagin.studio/getImage?customer=img-test&make=ford&modelFamily=mustang-gt&modelVariant=es&bodySize=2&modelYear=2024&powerTrain=petrol&trim=eu&paintId=imagin-grey&zoomType=fullscreen&width=1200&surrounding=sur2&viewPoint=1&aspectRatio=32:9&overlayArea=none

Example 3: Sunset House
URL: https://cdn.imagin.studio/getImage?customer=img-test&make=ford&modelFamily=mustang-gt&modelVariant=es&bodySize=2&modelYear=2024&powerTrain=petrol&trim=eu&paintId=imagin-grey&zoomType=fullscreen&width=1200&surrounding=sur3&viewPoint=1&aspectRatio=32:9&overlayArea=none

Example 4: Desert Rock
URL: https://cdn.imagin.studio/getImage?customer=img-test&make=ford&modelFamily=mustang-gt&modelVariant=es&bodySize=2&modelYear=2024&powerTrain=petrol&trim=eu&paintId=imagin-grey&zoomType=fullscreen&width=1200&surrounding=sur4&viewPoint=1&aspectRatio=32:9&overlayArea=none

Example 5: Warehouse
URL: https://cdn.imagin.studio/getImage?customer=img-test&make=ford&modelFamily=mustang-gt&modelVariant=es&bodySize=2&modelYear=2024&powerTrain=petrol&trim=eu&paintId=imagin-grey&zoomType=fullscreen&width=1200&surrounding=sur5&viewPoint=1&aspectRatio=32:9&overlayArea=none

Example 6: Brick House
URL: https://cdn.imagin.studio/getImage?customer=img-test&make=ford&modelFamily=mustang&modelRange=mach-1&modelVariant=co&bodySize=2&modelYear=2021&countryCode=eu&angle=23&zoomType=fullscreen&surrounding=sur6&viewPoint=1&aspectRatio=32:9&overlayArea=none

Example 7: Viewpoints for Surrounding 'sur1'
URL: https://cdn.imagin.studio/getImage?customer=img-test&make=bmw&modelFamily=series3&modelrange=m3&modelVariant=es&bodySize=2&modelYear=2024&powerTrain=petrol&trim=eu&paintId=imagin-grey&zoomType=fullscreen&width=1200&surrounding=sur1&viewPoint=1&aspectRatio=32:9&overlayArea=none
URL: https://cdn.imagin.studio/getImage?customer=img-test&make=bmw&modelFamily=series3&modelrange=m3&modelVariant=es&bodySize=2&modelYear=2024&powerTrain=petrol&trim=eu&paintId=imagin-grey&zoomType=fullscreen&width=1200&surrounding=sur1&viewPoint=2&aspectRatio=32:9&overlayArea=none
URL: https://cdn.imagin.studio/getImage?customer=img-test&make=bmw&modelFamily=series3&modelrange=m3&modelVariant=es&bodySize=2&modelYear=2024&powerTrain=petrol&trim=eu&paintId=imagin-grey&zoomType=fullscreen&width=1200&surrounding=sur1&viewPoint=3&aspectRatio=32:9&overlayArea=none

Notes:
- The 'customer' parameter is required.
- Various vehicle attributes (make, model, year, paintId, etc.) can be specified to customize the vehicle itself.
- The 'aspectRatio' and 'overlayArea' parameters control image composition.
```