Car Image API

Klanten · Wrap-, tint- en PPF-specialisten

Zo toont u een wrap, raamfolie of PPF vooraf op de exacte auto van de klant

Hoe wrap-, tint- en lakbeschermingsbedrijven witte basisrenders, exacte hex-lakkleuren en 3D-modellen gebruiken om een klus op de eigen auto van de klant te laten zien voordat het werk begint.

Het probleem: de klant wil het op de eigen auto zien

Een wrapbedrijf, een specialist in ruitfolie of een installateur van lakbeschermingsfolie verkoopt iets wat de klant pas kan zien als het klaar is. Het portfolio toont auto's van anderen. Het staal van de fabrikant toont het materiaal op een vlak kaartje. Wat de verkoop rondmaakt, is de eigen 2021 M4 van de klant in precies het satijngrijs waarover hij twijfelt, en daar bestaat geen foto van, omdat de klus nog niet is uitgevoerd.

Hetzelfde gat duikt verderop in de keten op. Een foliesnijder wil een strakke omtrek van de voorbumper voor een modeljaar dat de patroonbibliotheek nog niet dekt. Een configurator wil een draaiende weergave van de auto in een basiskleur waar de ontwerper overheen kan schilderen. Alle drie hebben hetzelfde nodig: een studiobeeld van een specifiek merk, model en jaar, in een lak naar keuze, met niets erachter.

Drie manieren waarop wrapbedrijven de renders gebruiken

De integraties voor wraps, raamfolie en lakbeschermingsfolie die vandaag op de API draaien, doen drie dingen, soms alle drie tegelijk:

  • Een witte basis, met het materiaal erover. Render het modeljaar van de klant in color=white op een transparante PNG en leg de wrap, de raamfolie of het bedrukte ontwerp er in de browser overheen. Het alfakanaal van de PNG is de omtrek van de auto.
  • Een lakkleur op hexcode. Voor een wrap in één kleur of een overspuiting slaat u het compositen over: color=686c70 levert de auto meteen in die lak, met glas en wielen onaangeroerd, als één voertuigafbeelding, net als een preset.
  • Een 3D-model voor de draaiende weergave. POST /api/v1/3d bouwt een getextureerd GLB-, USDZ- en FBX-model van het voertuig in een gekozen kleur, eenmaal per voertuig en kleur. Bij een gepubliceerd model horen een embedcode van twee regels voor de offertepagina en een USDZ die de klant op een iPhone in AR kan openen.

Eén bedrijf draait zijn batches via de ChatGPT-connector in plaats van via code, een vierde patroon dat hieronder een eigen sectie verdient.

Een witte basisrender met het materiaal erover

Een wrap vervangt de lak, dus begin met zo weinig mogelijk lak. color=white geeft de helderste neutrale carrosserie met de studioschaduw intact; de rechte side-weergave toont de meeste flank en de minste perspectivische verkorting, en dat is precies wat een materiaalvoorbeeld nodig heeft. Vraag om png (of webp) zodat het alfakanaal behouden blijft, en om het grootste formaat, 1024, zodat op het voorbeeld kan worden ingezoomd.

De basisrender, en dezelfde auto in een hex-lakkleur
# the customer's exact model year, in white: the base every material goes on top of
curl --fail-with-body -H "Authorization: Bearer $CAR_IMAGE_API_KEY" \
  "https://carimage.dev/api/v1/images/car?vehicle=veh_0ta0ejj0qad2w&view=side&color=white&w=1024&format=png" \
  -o m4-side-white.png

# a solid-color wrap or a factory paint, by hex: the API recolors the paint and leaves glass, trim and wheels alone
curl --fail-with-body -H "Authorization: Bearer $CAR_IMAGE_API_KEY" \
  "https://carimage.dev/api/v1/images/car?vehicle=veh_0ta0ejj0qad2w&view=side&color=686c70&w=1024&format=png" \
  -o m4-side-nardo.png

Voor een getextureerd materiaal is de compositing slechts een paar regels canvas-code: de render wordt eerst één keer als masker getekend, het materiaal wordt alleen geschilderd waar de auto staat, en de render wordt opnieuw getekend in multiply, zodat de schaduwen en reflecties door het materiaal heen terugkomen.

Een materiaal over de basis leggen, in de browser
// A textured material (carbon, chrome, a printed design) goes on in the browser.
// The white render is the mask: paint the material only where the car is, then let
// the render's own shading through.
const car = await loadImage(whiteBaseUrl); // transparent PNG from the API
const ctx = canvas.getContext("2d");
canvas.width = car.width;
canvas.height = car.height;

ctx.drawImage(car, 0, 0);
ctx.globalCompositeOperation = "source-atop"; // keep the car's alpha
ctx.fillStyle = ctx.createPattern(materialSwatch, "repeat");
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.globalCompositeOperation = "multiply"; // shading, reflections and panel lines come back
ctx.drawImage(car, 0, 0);
// The whole silhouette is covered, glass and wheels included: the API ships the car's
// alpha, not per-panel masks. Good enough for a quote; a solid color should use color=<hex> instead.

Een lak- of wrapkleur afstemmen op hexcode

Sinds lakkleuren een herkleuring van één neutrale render zijn, accepteert color naast de 15 presetnamen elke zescijferige hexwaarde: color=686c70 zonder hekje in een URL, "color": "#686c70" in JSON. Zoek de lakstaal van de fabrikant op, of de fabriekslakcode van de klant, en geef die mee. De herkleuring wordt alleen op de lak toegepast, dus glas, verlichting, sierlijsten en velgen blijven zoals ze zijn, en dat is precies het verschil tussen een wrap-preview en een getinte foto. Elke hexwaarde is één extra gecachete variant en één voertuigafbeelding van de maand, dus een palet van twintig kandidaten voor één auto in één aanzicht is twintig voertuigafbeeldingen.

Een 3D-model voor het draaiplateau en AR

Wanneer de offertepagina de auto moet laten draaien, bestelt u een model. POST /api/v1/3d neemt de voertuig-id en een kleur, rekent 100 credits en bouwt een getextureerde GLB, een browserversie daarvan, een USDZ en een FBX, plus een thumbnail. Het eerste model van een voertuig duurt 10–20 minutes; elke volgende kleur van dat voertuig geeft hetzelfde mesh in 1–2 minutes een nieuwe textuur. Een voertuig en kleur bestellen die u al hebt, is gratis (billing.already_owned: true), zodat een bedrijf zijn configurator voor elke klus op dezelfde witte basis kan baseren.

Bestel het in het wit en publiceer het meteen
curl -X POST https://carimage.dev/api/v1/3d \
  -H "Authorization: Bearer $CAR_IMAGE_API_KEY" \
  -H "Content-Type: application/json" \
  -H "Idempotency-Key: wrap-quote-4471" \
  -d '{"vehicle": "veh_0ta0ejj0qad2w", "color": "white", "publish": true}'
202 Accepted (ingekort)
{
  "data": {
    "id": "8c1d6b8e-2b4a-4f6e-9a2e-1f3c5d7e9b01",
    "object": "3d_model",
    "status": "queued",
    "progress": 0,
    "vehicle": {
      "id": "veh_0ta0ejj0qad2w",
      "make": "bmw",
      "model": "m4",
      "year": 2021
    },
    "color": "white",
    "files": null,
    "public": {
      "id": "m3d_…",
      "url": "https://carimage.dev/api/v1/3d/public/m3d_…",
      "files": null,
      "embed": {
        "script": "https://carimage.dev/embed/3d.js",
        "html": "<script src=\"https://carimage.dev/embed/3d.js\" async></script>\n<car-3d model=\"m3d_…\"></car-3d>"
      }
    }
  },
  "billing": {
    "charged_on": "creation",
    "credits_charged": 100,
    "credits_remaining": 24900,
    "already_owned": false
  },
  "request_id": "req_01j9y…"
}

publish: true geeft het model URL's zonder key op ons CDN en een embed nog voordat het klaar is; het element toont de voortgang totdat de bestanden binnen zijn. Stel view in op een van de negen camerahoeken voor het openingsbeeld, spin voor een draaiplateau, backdrop voor de studiovloer en ar om via de ingebouwde AR-viewer van de browser de USDZ aan iPhones en de GLB aan Android aan te bieden. De FBX is voor de ontwerper: open het bestand in Blender of een tool voor wrapontwerp, breng het ontwerp aan op de UV's, en de klant ziet zijn eigen ontwerp op zijn eigen auto.

De embed op de offertepagina
<script src="https://carimage.dev/embed/3d.js" async></script>
<car-3d model="m3d_…" view="front-3-4" spin backdrop="studio" ar alt="2021 BMW M4 in white"></car-3d>

Een batch uitvoeren vanuit ChatGPT of Claude

Niet elk bedrijf heeft een developer, en een van de drukste integraties op de API is een medewerker die een assistent om renders vraagt. Voeg https://carimage.dev/api/mcp toe als connector (ChatGPT en Claude melden zich aan via OAuth; de gebruiker keurt de scopes op het scherm goed) en de assistent krijgt dezelfde tools als een programma: resolve_vehicle om "2014 Audi S3 cabriolet, grey, side" om te zetten in exacte parameters, get_car_image voor één render, create_car_image_urls voor maximaal vijftig signed URLs in één aanroep, create_3d_model voor de 360°-draaiweergave.

Twee dingen zorgen ervoor dat een batch vanuit een assistent goed verloopt:

  • Geef per batch een idempotency_key mee. Assistenten proberen het opnieuw. Met een sleutel speelt een herhaalde create_car_image_urls het eerste resultaat opnieuw af (idempotent_replayed: true) en wordt er niets gefactureerd.
  • Houd rekening met het renderbudget, niet alleen met de rate limit. Voertuigaanzichten waar nog niemand om heeft gevraagd, moeten eerst worden voorbereid, en dat gaat af van het dagelijkse aandeel voorbereidingscapaciteit van het account (10% bij Pro). Een run van een paar honderd nieuwe auto’s in drie aanzichten kan die grens bereiken; de tool antwoordt dan met een tijdstip voor een nieuwe poging en reset_at, er wordt niets in rekening gebracht, en gecachete afbeeldingen blijven gewoon doorkomen. Spreid de run over een avond of twee, of stap over op Business voor een groter aandeel.

De installatie per client en de volledige lijst met tools vindt u op de MCP-pagina.

CLI, SDK en MCP

npx @meterapp/car-image
# the white base and a hex paint, straight to files
npx @meterapp/car-image get --vehicle veh_0ta0ejj0qad2w --view side --color white --width 1024 --out m4-side-white.png
npx @meterapp/car-image get --vehicle veh_0ta0ejj0qad2w --view side --color 686c70 --width 1024 --out m4-side-nardo.png

# the 3D model: published at once, polled until ready, every file downloaded
npx @meterapp/car-image 3d create --vehicle veh_0ta0ejj0qad2w --color white --publish --wait --out ./models
Met de TypeScript SDK
import { CarImageClient } from "@meterapp/car-image-sdk";

const client = new CarImageClient({ apiKey: process.env.CAR_IMAGE_API_KEY });

// 100 credits the first time. Ordering the same vehicle in the same color again
// answers billing.already_owned: true and charges nothing.
const { data: model } = await client.create3dModel({ vehicle: "veh_0ta0ejj0qad2w" }, { color: "white", publish: true });
const ready = await client.wait3dModel(model.id, { onProgress: (m) => console.log(m.stage, m.progress) });

// FBX for the designer's tool of choice, USDZ for the customer's iPhone, glb_web for the page.
const fbx = await client.download3dModel(ready.id, "fbx");
const embedHtml = ready.public?.embed.html;
  • MCP: get_car_image en create_car_image_urls in de kerntoolset, create_3d_model, get_3d_model en publish_3d_model met ?toolset=all; elke afbeeldingstool accepteert vehicle en een color in hex.
  • De 3D-documentatie behandelt webhooks (één ondertekende POST zodra een model klaar is), bestandsgroottes en elk embed-attribuut; Colors op de Images-pagina behandelt de regels voor lakkleuren.

Veelgestelde vragen

Kost een aangepaste hexkleur meer dan een standaardkleur?
Nee. Elke kleur is een herkleuring van één voorbereide weergave van dat voertuig, dus een preset, een opgezochte fabriekscode en een kleurstaal van een wrapfabrikant tellen elk als één voertuigafbeelding. Een hexwaarde die gelijk is aan de kleurstaal van een preset, is die preset.
Is de render nauwkeurig genoeg om folie op te snijden?
Nee. Renders zijn studiobeelden van merk, model en jaar, geen CAD-data of OEM-fotografie: de catalogus maakt geen onderscheid tussen uitvoeringen, en paneelnaden kunnen verschillen tussen twee weergaven van dezelfde auto. Gebruik ze om de klant zijn auto te laten zien en een offerte te maken; snijd patronen op basis van een sjabloon of het voertuig zelf.
Kunnen we de auto zonder lak krijgen, of alleen de ramen?
Het dichtst bij een blanco basis komt color=white op een transparante PNG, en het alfakanaal van de PNG is het silhouet van de auto. De API levert geen maskers per paneel of voor glas. Laat bij een wrap in één kleur color=<hex> het werk doen: dat geeft de lak een nieuwe kleur en laat glas, sierlijsten en wielen zoals ze zijn.
Welke aanzichten moet een offerte voor raamfolie of PPF gebruiken?
De rechte aanzichten: side (of side-right) voor de zijruiten en de flanken, front voor de voorruitstrook, motorkap en bumper, rear voor de achterruit. Op de driekwartaanzichten reageren klanten het meest, dus gebruik front-3-4 voor de hoofdafbeelding en de rechte aanzichten naast de regelposten.
Zijn wij eigenaar van het 3D-model?
Het is gelicentieerd, net als de renders: eenmalig betaald per voertuig en kleur per account, gratis opnieuw te bestellen, en u mag het in uw product gebruiken en op uw servers bewaren, ook nadat het abonnement is afgelopen. Elke extra kleur van een voertuig dat u al heeft, voorziet hetzelfde mesh van een nieuwe textuur, en door te publiceren krijgt het model kosteloos URL's zonder sleutel en een embed.