ForHosting KIT · サイト取得・監視

SVGパスのバウンディングボックスを計算

この計算ツールは、SVGパスの座標コマンドを読み取り、xとyの最小値・最大値に加えて幅と高さを返します。直線、ベジェ曲線、楕円弧、相対コマンド、滑らかな制御点、閉じたサブパスに対応しています。曲線は端点を越える場合があり、制御点も必ずしも曲線上にないため、ソース内の数値を集めるだけではなく、幾何学的な極値を評価します。

● Beta無料・ブラウザ内で実行

無料で実行 API仕様を見る

ご利用方法ウェブAPIメールTelegramアプリ近日

パスデータだけから範囲を計算します

SVGパス要素の<code>d</code>属性の値を入力欄に貼り付けてください。移動、直線、水平線、垂直線、3次・2次ベジェ曲線、滑らかな曲線、楕円弧、パスを閉じる各標準コマンドに対応し、絶対座標と相対座標のどちらも使用できます。結果は<code>min_x</code>、<code>min_y</code>、<code>max_x</code>、<code>max_y</code>、幅、高さです。これらはパス固有の座標系における軸平行の長方形を示します。要素や親グループの変換は適用せず、線幅、線端、結合、マーカー、フィルター、クリッピングも含めません。そのため、符号化された中心線の形状を正確に測定できます。空のパスはエラーになりますが、移動点が1つだけのパスは、幅と高さがともにゼロの有効な結果になります。

曲線に解析的な極値が必要な理由

正確な範囲は、線分の端点を見るだけでは求められません。ベジェ曲線は始点と終点の間で最小値や最大値に達することがあり、外側の制御点を曲線が通らない場合もあります。本ツールは各座標の導関数を解き、区間内にある根を評価します。楕円弧はSVGの端点形式から中心形式へ変換し、半径の自動補正と回転を考慮して極値角を導出し、選択された掃引に含まれる候補だけを採用します。滑らかなコマンドでは直前の制御点を反転し、相対座標では現在点を基準にし、パスを閉じる際は開始点への線も含めます。サンプリングを使わないため、任意の標本位置の間にある細いピークも見落としません。

SVGのレイアウトやツールで結果を活用します

返された長方形は、viewBoxの作成、画像の中央配置、アイコンの正規化、パス範囲の比較、注釈の配置、生成図形の検証に利用できます。一致するviewBoxを作るには、<code>min_x min_y width height</code>の順に指定してください。目に見える線がある場合は線幅や結合に必要な余白を後から追加し、変換済みの図形は適切な行列処理で扱ってください。パーサーはカンマまたは空白の区切り、隣接する符号、小数、科学表記を受け付けます。不明なコマンド、不完全な座標、壊れた文字列、不正な円弧フラグ、負の半径は明確に拒否します。結果は決定的で、ネットワークや外部レンダラーを必要とせず、ブラウザーとAPIで同じ純粋な計算を使用します。

活用例

図形に合うviewBoxを作成

最小座標、幅、高さから、パス形状を隙間なく囲むviewBoxを作成します。

アイコン集を正規化

共通座標系へ移動または拡大縮小する前に、各パスを一貫した方法で測定します。

生成したSVG図形を検証

プログラムで作成した曲線と円弧が、想定した描画領域内に収まるか確認します。

よくある質問

曲線と円弧も正確に含まれますか？

はい。サンプリングではなく、ベジェ曲線と回転楕円弧の解析的な極値を評価します。

線幅も含まれますか？

いいえ。パス形状のみを対象とし、線、線端、結合、マーカー、フィルターなどの描画効果は含みません。

SVGの変換は適用されますか？

いいえ。パス固有の座標系で測定し、要素や祖先要素の変換は入力の対象外です。

パスが空の場合はどうなりますか？

空のパスにはバウンディングボックスがないため、無効な入力としてリクエストが失敗します。

APIリクエストの料金はいくらですか？

APIリクエスト1回につき$0.002です。ブラウザー版はローカルで無料実行できます。

開発者向け — APIアクセス

このページの機能はすべてAPIからも利用できます。自社システムに組み込みたいチーム向けのセクションです。それ以外の方は上のツールをそのままお使いください。

エンドポイント

POSThttps://api.kit.forhosting.com/web/svg-path-bounding-box

Bearerトークンで認証し、POST1回でタスクをキューに登録します。結果はWebhookまたは署名付きリンクで受け取れます。

お使いのスタックから呼び出す

curl -X POST https://api.kit.forhosting.com/web/svg-path-bounding-box \
  -H "Authorization: Bearer $KIT_KEY" \
  -H "Content-Type: application/json" \
  -d '{"path":"M10 20 C30 0 50 40 70 20 L90 60"}'

const res = await fetch("https://api.kit.forhosting.com/web/svg-path-bounding-box", {
  method: "POST",
  headers: {
    "Authorization": `Bearer ${process.env.KIT_KEY}`,
    "Content-Type": "application/json"
  },
  body: JSON.stringify({
    "path": "M10 20 C30 0 50 40 70 20 L90 60"
  })
});
const { task_id } = await res.json();

import os, requests

res = requests.post(
    "https://api.kit.forhosting.com/web/svg-path-bounding-box",
    headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
    json={
    "path": "M10 20 C30 0 50 40 70 20 L90 60"
},
)
task_id = res.json()["task_id"]

<?php
$res = file_get_contents("https://api.kit.forhosting.com/web/svg-path-bounding-box", false, stream_context_create([
  "http" => [
    "method"  => "POST",
    "header"  => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
    "content" => '{"path":"M10 20 C30 0 50 40 70 20 L90 60"}',
  ],
]));
$task = json_decode($res, true);

body := bytes.NewBufferString(`{"path":"M10 20 C30 0 50 40 70 20 L90 60"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/web/svg-path-bounding-box", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)

リクエスト例

{
  "path": "M10 20 C30 0 50 40 70 20 L90 60"
}

レスポンス例

{
  "task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
  "type": "web.svg_path_bounding_box",
  "status": "queued",
  "_links": {
    "result": "/tasks/tsk_…/result"
  }
}

非同期APIです。task_idは即時に返ります。ポーリングは1秒あたり1リクエストまでです。

料金

1リクエストあたり$0.002

単価はすべて公開しています。トークン換算や独自クレジットはありません。失敗したタスクは課金されません。

制限

`timeout_sec`	30
`max_crawl_pages`	25

エラー

HTTP	コード	意味
`401`	`unauthorized`	APIキーが無効か、指定されていません。Authorizationヘッダーを確認してください。
`402`	`insufficient_balance`	残高が不足しています。チャージ後に再度お試しください。
`404`	`unknown_type`	指定されたタスクタイプは存在しません。タイプ名を確認してください。
`429`	`rate_limited`	リクエストが多すぎます。しばらく待ってから再度お試しください。

KITの完全なドキュメントを見る →