# Imagini SVG de hărți
`/v1/render/*` returnează o hartă ca un SVG complet: roata, bi-roata, tri-roata, compozit, hărți vedice (nord, sud, est), rețea de aspecte, cosmogramă, fază de Lună, cronogramă, bioritmi, zona de umbre și hartă zodiacală. Vă trimiteți datele de naștere, calculăm hartă și o desenăm. Lista completă a rutelor și a parametrilor se află în [ghidul API](/docs/api/).
Același cod de desenare a fost publicat ca pachet npm [`@astroway/render`](https://www.npmjs.com/package/@astroway/render): dacă aveți deja datele de hartă, roata poate fi desenată în browser sau pe serverul dumneavoastră, și va corespunde cu ce returnează API, byte cu byte. Versiunea de desenare a API-ului este returnată în header-ul `X-Render-Version`.
## Cerere
```bash
curl -X POST https://api.astroway.info/v1/render/wheel-western \
-H "X-Api-Key: $ASTROWAY_KEY" -H "Content-Type: application/json" \
-d '{"date":"1990-05-15","time":"14:30:00","timezoneOffset":3,"latitude":50.45,"longitude":30.52,
"options":{"theme":"css","format":"svg"}}' > wheel.svg
```
`format: "svg"` returnează fișierul SVG complet, tipicul `json` închideți linia SVG într-o răspuns API obișnuit. Tema: `light`, `dark`, `console` și `css`.
## Tema css: culorile site-ului dumneavoastră
Cu `theme: "css"` fiecare culoare din SVG este scrisă ca o variabilă CSS cu culoarea temei luminoase ca rezervă, de exemplu `var(--aw-ring, #222)`. Așezați SVG-ul în paginile HTML (nu în `![]()
`: acolo variabilele nu trec) și stabiliți variabilele:
```css
.chart {
--aw-chart-bg: transparent;
--aw-ring: #444;
--aw-fg: currentColor;
--aw-aspect-tense: crimson;
}
```
Fără nici o variabilă hartă arată exact ca `light`. Regula CSS a site-ului dumneavoastră este mai puternică decât variabila, așadar un element separat poate fi recolorat cu clasă.
| Variabilă | Ce colorează |
|---|---|
| `--aw-chart-bg` | fundalul hărții |
| `--aw-fg`, `--aw-muted` | simbolurile și subtitlurile, textul secundar și diviziunile |
| `--aw-ring` | cercurile și liniile rețelei de aspecte |
| `--aw-houses-fill` | câmpul hărții vedice, discul hărții zodiacale, hărți de umbre |
| `--aw-benefic` | planetele din cercul exterior, lagna în hărți vedice, evenimentele cronogramelor fără culoarea proprie |
| `--aw-malefic` | semnul retrogradului ℞, zona de umbre |
| `--aw-aspect-harmonious`, `--aw-aspect-tense`, `--aw-aspect-neutral`, `--aw-aspect-minor`, `--aw-aspect-quintile` | liniile și simbolurile aspectelor |
| `--aw-moon-shadow`, `--aw-moon-light` | fază de Lună |
| `--aw-cycle-physical`, `--aw-cycle-emotional`, `--aw-cycle-intellectual` | bioritmi |
## Clase și data-atribute
În tema `css` roatele vestice (`wheel-western`, `bi-wheel`, `tri-wheel`, `composite`) și rețeaua de aspecte au clase fixe. Numele este doar adăugat, niciodată renumit, așadar pe ele se pot scrie stiluri și scripturi.
- Roata: `aw-bg`, `aw-ring`, `aw-sign aw-sign-leo`, `aw-sign-line`, `aw-tick`, `aw-house-cusp`, `aw-house-number`, axele `aw-axis aw-asc` (`aw-dsc`, `aw-mc`, `aw-ic`), subtitlurile lor `aw-label aw-axis-label`, titlul `aw-title`.
- Planeta: grupa ``, retrogradă are încă `aw-retrograde`, planetele din cercul exterior `aw-layer-1`. În interior `aw-glyph`, `aw-retro` (semnul ℞) și `aw-planet-tick`.
- Aspect: linia `aw-aspect aw-aspect-trine`, linia între două hărți are încă și `aw-cross-aspect`.
- Rețeaua de aspecte: `aw-grid-header`, `aw-grid-cell`, `aw-aspect aw-aspect-square`, `aw-orb`.
Gruparea planetei are `data-planet` (`sun`, `north-node`, `lilith`; pe exterior `b-sun`, pe al treilea `c-sun`) și `data-label` cu numele și poziția: `Mercury 8°00' Taurus, retrograd`. Linia aspectului și celula rețelei de aspecte au `data-a` și `data-b`. Așa se subliniază toți aspectele planetei la așezare:
```js
svg.querySelectorAll('.aw-planet').forEach((g) => g.addEventListener('mouseenter', () => {
const id = g.dataset.planet;
svg.querySelectorAll('.aw-aspect').forEach((line) =>
line.classList.toggle('is-on', line.dataset.a === id || line.dataset.b === id));
}));
```
## Subtitlurile proprii
Roatele vestice primesc `options.labels`: cuvintele dumneavoastră pentru subtitlurile axelor, pentru `` și `<desc>`, care sunt citite de cititori ecran, și pentru numele în `data-label`. Cheile care nu există rămân în engleză; noi nu le traducem.
```json
"options": {
"theme": "css",
"labels": {
"asc": "Асц", "mc": "МС", "title": "Натальна карта",
"bodies": { "Sun": "Сонце", "Moon": "Місяць" },
"signs": ["Овен","Телець","Близнюки","Рак","Лев","Діва","Терези","Скорпіон","Стрілець","Козеріг","Водолій","Риби"],
"retrograde": "ретроградний"
}
}
```
`bodies` are cheile în engleză (`Sun`, `North Node`), `signs` este exact 12 nume, începând cu Orașul, fiecare subtitlu până la 40 caractere.
## Aspecte între două hărți
`/v1/render/bi-wheel` cu `options.crossAspects: true` desenează punctele aspectelor între harta internă și cea externă, același set care `POST /v1/synastry` returnează ca `crossAspects`. Pariul în care unul dintre corpuri nu este desenat este ignorat. Tipic, desenarea este oprită.
## Hartă gata în loc de date de naștere
Dacă harta dumneavoastră este deja gata, pentru că ați făcut recent `POST /v1/chart`, trimiteți-o `data` în loc de datele de naștere, și noi doar o desenăm. Așa funcționează `wheel-western`, `aspect-grid` și `bi-wheel` (acolo `natal.chart` și `outer.chart`, ambele au să fie harte gata). Imaginea va fi bine de acord cu datele de naștere.
```json
{ "chart": { "planets": [ ... ], "houses": { "cusps": [ ... ], "ascendant": 7.77, "mc": 277.12 }, "aspects": [ ... ] },
"options": { "theme": "css" } }
```
Câmpurile de răspuns inutile pot fi ignorate. Se verifică dacă harta este desenată: între 1 și 30 corpuri, lungimi între 0 și 360, exact 12 cuspi. Corpul care are și `chart` și datele de naștere este excludat cu 400.
## Preț
Apelul `/v1/render/*` cu datele de naștere costă 10 credite, pentru că harta este calculată. Dacă harta dumneavoastră este gata `chart`, apelurile `/v1/render/wheel-western`, `/v1/render/aspect-grid` și `/v1/render/bi-wheel` costă 1 credit. Tema, clasele și subtitlurile nu afectează prețul.