# SVGマップ画像

`/v1/render/*` は、完成した SVG としてチャートを返す：出生ホイール、ビウィール、トリウィール、コンポジット、ヴェーダチャート（北、南、東）、アスペクトグリッド、コスモグラム、月相、タイムライン、バイオリズム、食欠帯、星図。出生データを送ると、チャートを計算して描画する。全ルートとパラメータの一覧は [APIリファレンス](/docs/api/) にある。

同じ描画コードは npm パッケージ [`@astroway/render`](https://www.npmjs.com/package/@astroway/render) として公開されている：チャートデータがすでにある場合、ブラウザや自分のサーバーでホイールを描画でき、API が返すものとバイト単位で一致する。描画バージョンは API のヘッダー `X-Render-Version` で返される。

## リクエスト

```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"` はファイルそのものを返し、デフォルトの `json` は SVG 文字列を通常の API 応答にラップする。テーマは `light`, `dark`, `console`, `css`。

## CSS テーマ: サイトの色

`theme: "css"` を指定すると、SVG の各色が CSS 変数として記述され、ライトテーマの色がフォールバックになる。例: `var(--aw-ring, #222)`。SVG を HTML ページに埋め込む（`<img>` では変数は機能しない）で、変数を設定する：

```css
.chart {
  --aw-chart-bg: transparent;
  --aw-ring: #444;
  --aw-fg: currentColor;
  --aw-aspect-tense: crimson;
}
```

変数を設定しなければ、カードは正確に `light` と同じ見た目になる。ページの CSS ルールは変数より優先されるので、個別要素はクラスで上書きできる。

| 変数 | 何を塗るか |
|---|---|
| `--aw-chart-bg` | 背景 |
| `--aw-fg`, `--aw-muted` | グリフとラベル、二次テキストと目盛り |
| `--aw-ring` | 円とグリッド線 |
| `--aw-houses-fill` | ヴェーダチャートの領域、星図のディスク、食欠帯マップ |
| `--aw-benefic` | 外側リングの惑星、ヴェーダチャートのラグナ、カラーなしのタイムラインイベント |
| `--aw-malefic` | 逆行記号 ℞、食欠帯 |
| `--aw-aspect-harmonious`, `--aw-aspect-tense`, `--aw-aspect-neutral`, `--aw-aspect-minor`, `--aw-aspect-quintile` | アスペクトの線とシンボル |
| `--aw-moon-shadow`, `--aw-moon-light` | 月相 |
| `--aw-cycle-physical`, `--aw-cycle-emotional`, `--aw-cycle-intellectual` | バイオリズム |

## クラスと data 属性

`css` テーマでは、西洋ホイール（`wheel-western`, `bi-wheel`, `tri-wheel`, `composite`）とアスペクトグリッドに固定クラスが付く。名前は追加されるだけで変更されないので、スタイルやスクリプトで利用できる。

- ホイール: `aw-bg`, `aw-ring`, `aw-sign aw-sign-leo`, `aw-sign-line`, `aw-tick`, `aw-house-cusp`, `aw-house-number`, 軸 `aw-axis aw-asc` (`aw-dsc`, `aw-mc`, `aw-ic`)、それらのラベル `aw-label aw-axis-label`、タイトル `aw-title`。
- 惑星: グループ `<g class="aw-planet aw-planet-sun">`、逆行惑星は `aw-retrograde`、外側リングの惑星は `aw-layer-1`。内部は `aw-glyph`, `aw-retro`（記号 ℞） と `aw-planet-tick`。
- アスペクト: 線 `aw-aspect aw-aspect-trine`、2つのチャート間の線は `aw-cross-aspect`。
- アスペクトグリッド: `aw-grid-header`, `aw-grid-cell`, `aw-aspect aw-aspect-square`, `aw-orb`。

惑星グループは `data-planet`（`sun`, `north-node`, `lilith`; 外側リングは `b-sun`, 第三リングは `c-sun`）と、名前と位置を含む `data-label`（例: `Mercury 8°00' Taurus, retrograde`）を持つ。アスペクト線とグリッドセルは `data-a` と `data-b` を持ち、ホバー時に惑星のすべてのアスペクトがハイライトされる：

```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));
}));
```

## 独自ラベル: labels

西洋ホイールは `options.labels` を受け取る：軸ラベル、スクリーンリーダーが読む `<title>` と `<desc>`、そして `data-label` の名前に使う自分の語句。存在しないキーは英語のままで、我々は翻訳しない。

```json
"options": {
  "theme": "css",
  "labels": {
    "asc": "Асц", "mc": "МС", "title": "Натальна карта",
    "bodies": { "Sun": "Сонце", "Moon": "Місяць" },
    "signs": ["Овен","Телець","Близнюки","Рак","Лев","Діва","Терези","Скорпіон","Стрілець","Козеріг","Водолій","Риби"],
    "retrograde": "ретроградний"
  }
}
```

`bodies` のキーは英語（`Sun`, `North Node`）で、`signs` は正確に12個の名前で、牡羊座から始まる。各ラベルは最大40文字。

## 2つのチャート間のアスペクト

`/v1/render/bi-wheel` に `options.crossAspects: true` を指定すると、内側と外側のチャート間のアスペクトを点線で描く。これは `POST /v1/synastry` が返す `crossAspects` と同じセットだ。どちらかの天体が描かれていないペアはスキップされる。デフォルトは無効。

## 出生データの代わりに完成チャートを使用

すでにチャートがある場合、たとえば直前に `POST /v1/chart` を呼び出したなら、出生データの代わりに `chart` フィールドにその `data` を送れば、我々はそれを描くだけになる。`wheel-western`, `aspect-grid`, `bi-wheel` は同様に動作し（`natal.chart` と `outer.chart` が必要で、どちらも完成チャートであること）、描画結果は出生データから生成したものとバイト単位で同一になる。

```json
{ "chart": { "planets": [ ... ], "houses": { "cusps": [ ... ], "ascendant": 7.77, "mc": 277.12 }, "aspects": [ ... ] },
  "options": { "theme": "css" } }
```

余分なレスポンスフィールドは切り取らなくてもよい。描画対象は検証される：天体は1〜30個、経度は0〜360、クスピッドは正確に12個。`chart` と出生データの両方がある天体は400で除外される。

## 料金

`/v1/render/*` を出生データで呼び出すと、チャート計算が必要なため10クレジットかかる。完成チャート `chart` を使う場合、`/v1/render/wheel-western`, `/v1/render/aspect-grid`, `/v1/render/bi-wheel` の呼び出しは1クレジットになる。テーマ、クラス、ラベルは料金に影響しない。