L'API Chillin Render consente di specificare il contenuto video e i parametri da rendere definendo una struttura JSON come quella sottostante.
Vai a Render Console per ottenere crediti per l'API Render e generare la tua chiave API Render
Invia una richiesta POST all'endpoint dell'API Render con la tua chiave API:
1curl -X POST https://render-api.chillin.online/render/v1 \
2-H "Accept: application/json" \
3-H "Content-Type: application/json" \
4-H "Authorization: Bearer YOUR_API_KEY" \
5-d @request.json1{
2"compositeWidth": 1920,
3"compositeHeight": 1080,
4"fps": 30,
5"projectData": {
6 "type": "",
7 "width": 1920,
8 "height": 1080,
9 "fill": "#000000",
10 "view": [
11 {
12 "id": "bba95c7f-652b-4380-b166-6bece989f527",
13 "type": "Image",
14 "start": 0,
15 "duration": 5,
16 "trackIndex": 0,
17 "x": 0,
18 "y": 0,
19 "width": 3629,
20 "height": 5444,
21 "blendMode": "normal",
22 "anchorX": 1814.5,
23 "anchorY": 2722,
24 "rotation": 0,
25 "scaleX": 0.19838354151359294,
26 "scaleY": 0.19838354151359294,
27 "alpha": 1,
28 "skewX": 0,
29 "skewY": 0,
30 "hidden": false,
31 "locked": false,
32 "keyframes": [],
33 "externalUrl": "https://images.pexels.com/photos/33189512/pexels-photo-33189512.jpeg",
34 "ext": "jpeg"
35 }
36 ],
37 "audio": [],
38 "effect": [],
39 "transition": [],
40 "version": 0,
41 "duration": 5
42}
43};
44L'API opera in modalità asincrona e restituisce una risposta come questa:
1{
2"code": 0,
3"data": {
4 "message": "Async render request submitted successfully",
5 "render_id": 100000,
6 "status": "processing"
7},
8"msg": "success"
9}
10Tutti gli oggetti JSON includono un oggetto progetto video, specificando la larghezza composita, l'altezza composita e la risoluzione del video.
L'oggetto progetto contiene i parametri di base per il rendering del video, come larghezza, altezza, durata, colore di sfondo e altro ancora.
Il progetto include anche uno o più elementi, dove ciascun elemento rappresenta un componente video, come un video, un'immagine, un testo, una forma, un audio o un effetto.
Ogni elemento contiene parametri specifici per il componente, come posizione, dimensione, colore, contenuto e così via.
1{
2"compositeWidth": 1920,
3"compositeHeight": 1080,
4"fps": 30,
5"projectData": {
6 "type": "",
7 "width": 1920,
8 "height": 1080,
9 "fill": "#000000",
10 "view": [
11 {
12 "id": "8ecf7475-2c6c-47f9-827b-a09c7913f4c0",
13 "type": "Image",
14 "start": 0,
15 "duration": 5,
16 "trackIndex": 0,
17 "x": -570.0335392757963,
18 "y": -170.90659033307685,
19 "blendMode": "normal",
20 "anchorX": 1302,
21 "anchorY": 2312,
22 "rotation": 0,
23 "scaleX": 0.23356401384083045,
24 "scaleY": 0.23356401384083045,
25 "alpha": 1,
26 "skewX": 0,
27 "skewY": 0,
28 "keyframes": [],
29 "externalUrl": "https://images.pexels.com/photos/30465303/pexels-photo-30465303.jpeg",
30 "ext": "jpeg"
31 }
32 ],
33 "audio": [],
34 "effect": [],
35 "transition": [],
36 "version": 0,
37 "duration": 5
38}
39};
40Il motore di rendering supporta sia elementi 2D che 3D. Mentre il canvas è definito con width e height in pixel, il motore utilizza una telecamera prospettica per il rendering 3D:
rotationX, rotationY e rotation (asse Z).Questo design consente una miscelazione senza soluzione di continuità di elementi 2D e 3D nello stesso progetto. Gli elementi 2D tradizionali (con z=0) vengono resi esattamente come prima, mentre gli elementi 3D possono essere posizionati e ruotati nello spazio tridimensionale.
Ecco un semplice esempio di un elemento cubo 3D:
1{
2"id": "3d-cube-001",
3"type": "3D",
4"start": 0,
5"duration": 5,
6"trackIndex": 0,
7"x": 960,
8"y": 540,
9"z": 0,
10"width": 200,
11"height": 200,
12"anchorX": 100,
13"anchorY": 100,
14"rotation": 0,
15"rotationX": 30,
16"rotationY": 45,
17"scaleX": 1,
18"scaleY": 1,
19"scaleZ": 1,
20"alpha": 1,
21"ext": "geometry",
22"geometryType": "cube",
23"nodeCategory": "basic",
24"geometryColor": "#4A90E2"
25}
26Differenze chiave rispetto agli elementi 2D:
type: "3D" identifica questo come un elemento 3Dz, rotationX, rotationY e scaleZ abilitano trasformazioni 3DgeometryType specifica la forma 3D (cubo, sfera, cilindro, ecc.)geometryColor imposta il colore di base della geometria 3DPer ulteriori dettagli sugli elementi 3D, consulta la documentazione 3D Element.
Il tuo JSON di richiesta deve aderire rigorosamente allo schema JSON definito in questo documento. Puoi testare e generare il corrispondente JSON di richiesta nell'Editor Video Chillin.