フェイス・時計・記号・演算子

drawlib.shapes の フェイス・時計・記号・演算子 カテゴリは、8 種類のペルソナ・時刻・天体・機械・数学記号プリミティブ を提供します。9 種類の表情を持つユーザー/脅威フェイス(face)、アナログ文字盤およびフォント不要の 7 セグメントデジタル時計(clock)、スケジュールやテーマ用の太陽・月シンボル(sun, moon)、ヘルスチェック用ハート(heart)、サーバーレス/イベント用稲妻ボルト(lightning)、N 枚歯の機械歯車(gear)、そして 6 種類の幾何学的な数学演算子記号(math_symbol)を利用できます。

shapes_symbol_1
drawlib.shapes におけるフェイス・時計・天体・機械・数学演算子全 8 プリミティブの概要
Source Code
from drawlib.canvas import save, setup
from drawlib.shapes import (
    clock,
    face,
    gear,
    heart,
    lightning,
    math_symbol,
    moon,
    sun,
)
from drawlib.styles import Styles
from drawlib.text import text

setup(width=128, height=58)

cap_st = Styles.DarkBold.patch(text_size=9.5)

# Row 1: face, clock (analog), clock (digital), sun, moon
face((16, 43), radius=8.2, variant="smile", style=Styles.PrimaryFlat)
text((16, 30), "face", style=cap_st)

clock((42, 43), radius=8.2, variant="ticks", hour=10, minute=10, style=Styles.Neutral)
text((42, 30), 'clock("ticks")', style=cap_st)

clock((70, 43), radius=8.2, variant="digital", hour=12, minute=34, style=Styles.PrimaryFlat)
text((70, 30), 'clock("digital")', style=cap_st)

sun((96, 43), radius=8.5, variant="rays", num_rays=8, style=Styles.WarningFlat)
text((96, 30), "sun", style=cap_st)

moon((116, 43), width=14, height=16, variant="crescent", style=Styles.SecondaryNeutral)
text((116, 30), "moon", style=cap_st)

# Row 2: heart, lightning, gear, math_symbol (+ and =)
heart(
    (18, 16),
    width=17,
    height=15.5,
    variant="standard",
    style=Styles.DangerNeutral,
    text="OK",
    text_style=Styles.DarkBold.patch(text_size=9.5),
)
text((18, 3.5), "heart", style=cap_st)

lightning((45, 16), width=11.5, height=18, variant="standard", style=Styles.WarningFlat)
text((45, 3.5), "lightning", style=cap_st)

gear(
    (74, 16),
    num_teeth=8,
    radius_ext=9.2,
    radius_int=6.8,
    hole_radius=3.0,
    style=Styles.PrimaryNeutral,
)
text((74, 3.5), "gear", style=cap_st)

math_symbol((99, 16), symbol="+", width=12, style=Styles.PrimaryFlat.patch(shape_r=0.5))
math_symbol((115, 16), symbol="=", width=12, style=Styles.SecondaryNeutral.patch(shape_r=0.5))
text((107, 3.5), "math_symbol", style=cap_st)

save()

1. 基本の幾何構造とコンセプト

このカテゴリの全 8 シンボルプリミティブは中心座標 xy にきれいにアンカー固定され、セマンティックな variant プリセットと表現力豊かな幾何パラメータを組み合わせることで、手動のパス計算なしにペルソナ・時計・天体アイコン・歯車・数学演算子を描き分けられます。face と heart による SLO/脅威ステータスの遷移、clock におけるアナログの hour・minute 針の進行やフォント不要 7 セグメント digital 表示への切り替え、sun・moon・lightning の光線数・月相・mirror 反転、そして gear と math_symbol による歯形・中心穴・演算子バー太さの制御を確認してみましょう。

shapes_symbol_2
パラメータ&ジオメトリツアー: face・clock・sun・moon・lightning・gear・math_symbol のライブ変形(APNG アニメーション)
  • ペルソナとヘルスのプリセット(face & heart): セマンティックな variant プリセットにより、顔の表情("smile"〜"devil")や死活監視ハートの "standard"/"broken" 状態を中心座標 xy で切り替えられます。
  • アナログ針とフォント不要デジタル表示(clock): hour と minute により 90°(12:00)基準でアナログ文字盤/ストップウォッチの針を時計回りに滑らかに進めるほか、variant="digital" では純ベクターの 7 セグメント HH:MM 数字を描画します。
  • 天体の光線・月相と水平反転(sun, moon, lightning): num_rays と variant で太陽ビームや月の満ち欠けを造形し、mirror=True で moon や lightning を -X/+X 方向に水平反転します。
  • パラメトリック歯車と幾何演算子(gear & math_symbol): num_teeth, radius_ext, radius_int, hole_radius, style.shape_r で歯車を精密に設計でき、thickness_ratio で単一輪郭の演算子バー("+", "×", "≠" など)の太さを調整できます。

2. フェイス・時計・記号・演算子プリミティブの早見表

全 8 関数の必須形状引数、組み込みバリエーション、主なモディファイア、ダイアグラムでの主な用途を以下のマトリクスで比較できます。

関数 必須の形状引数 バリエーション 主な形状モディファイア 主なダイアグラム用途
face xy, radius "smile", "neutral", "surprised", "sad", "angry", "dizzy", "dead", "skull", "devil" style.angle ユーザー/アクターペルソナ、SLO ヘルス状態、クラッシュノード("dead")、脅威アクター("devil", "skull")。
clock xy, radius "standard", "ticks"("dial"), "alarm", "stopwatch"("timer"), "digital" hour=10.0, minute=10.0 Cron ジョブ、SLA タイマー、レイテンシ計測ストップウォッチ、フォント不要 7 セグメント HH:MM タイムスタンプ。
sun xy, radius "rays"("standard"), "ring", "beams" num_rays: int = 8 日中スケジュール、ライトテーマアイコン、太陽光/クリーンエネルギーノード、輝度インジケータ。
moon xy, width, height "crescent"("standard"), "thin", "waxing", "half" mirror: bool = False 夜間バッチ/バックアップジョブ、ダークテーマアイコン、スリープ/アイドル状態。
heart xy, width, height "standard"("classic"), "broken" style.angle Liveness/ヘルスチェックプローブ("standard")、縮退/異常サービス状態("broken")。
lightning xy, width, height "standard", "flat", "double", "flat_double", "angled", "slanted" mirror=False, style.shape_r サーバーレス関数、イベント/Webhook トリガー、キャッシュヒット、電源/バーストコンピュート。
gear xy, num_teeth, radius_ext, radius_int 中実コア(hole_radius=None)またはリング型(hole_radius > 0) tooth_ext_ratio, tooth_int_ratio, style.shape_r バックグラウンドワーカーデーモン、CI/CD 自動化エンジン、構成/設定ノード。
math_symbol xy, symbol, width "+", "-", "×", "÷", "=", "≠"(および英単語エイリアス) height=None, thickness_ratio, style.shape_r ビジュアルなアーキテクチャ数式([Service A] + [Cache] = [Low Latency])、比較マトリクス。

3. 表情豊かなアクター・ステータス・脅威フェイス (face)

ユーザーペルソナ、カスタマージャーニーマップ、システムヘルス指標、脅威/攻撃者モデリング向けに、face は 9 種類の組み込み表情(variant)を備えた円形またはシルエット型のフェイスを描画します。

face(
    xy: tuple[float, float],
    radius: float,
    *,
    style: Style,
    variant: Literal[
        "smile", "neutral", "sad", "angry", "surprised",
        "dizzy", "dead", "skull", "devil",
    ] = "smile",
    text: str = "",
    text_style: Style | None = None,
) -> None

パラメータリファレンスと variant オプション

パラメータ 型 デフォルト 説明
xy tuple[float, float] 必須 フェイスの中心座標 (x, y)。
radius float 必須 フェイスの外接半径(> 0)。
variant FaceVariant "smile" 表情またはペルソナのバリエーション(大文字・小文字区別なし):
• "smile": 上向きの 3 次ベジェ曲線による笑顔。
• "neutral": まっすぐ水平な口元。
• "surprised": 楕円形に開いた 'O' 字の口元。
• "sad": 下向きの 3 次ベジェ曲線による悲しみ顔。
• "angry": 下向きの口元+内側へ傾いた怒り眉。
• "dizzy": 'X' 字の目+波打つ口元(過負荷/縮退ノード)。
• "dead": 'X' 字の目+舌を出した水平な口元(クラッシュ/OOM Kill 状態)。
• "skull": 頭蓋骨+顎のシルエットに眼窩・鼻腔・歯を備えたドクロ(致命的障害/Poison Pill)。
• "devil": 湾曲した角+釣り上がった眉+不敵な笑み(攻撃者/悪意あるアクター)。
style Style 必須 フェイスの塗りつぶし、輪郭線、および回転(angle)。目や口のパーツは、枠線がある場合は style.shape_line_color を自動使用し、枠線のないフラット塗り(Styles.PrimaryFlat など)では高コントラストな text_color/白色を自動選択します。
text / text_style str / Style | None "" / None 任意のテキストラベルとタイポグラフィスタイル。
from drawlib.canvas import save, setup
from drawlib.shapes import face
from drawlib.styles import Styles
from drawlib.text import text

setup(width=132, height=44)

variants = [
    ("smile", Styles.PrimaryFlat),
    ("neutral", Styles.Neutral),
    ("surprised", Styles.SecondaryNeutral),
    ("sad", Styles.Neutral),
    ("angry", Styles.WarningNeutral),
    ("dizzy", Styles.WarningNeutral),
    ("dead", Styles.DangerNeutral),
    ("skull", Styles.Neutral),
    ("devil", Styles.DangerFlat),
]

for i, (v_name, st) in enumerate(variants):
    cx = 10 + i * 14.0
    face((cx, 26), radius=5.6, style=st, variant=v_name)
    text((cx, 11), f'"{v_name}"', style=Styles.DarkBold.patch(text_size=9.5))

save()
shapes_symbol_3
drawlib.shapes.face が提供する全 9 種類のフェイス variant

4. アナログ時計とフォント不要デジタル時計 (clock)

clock は、時刻に応じて動的に角度が変わる時針・分針を備えた アナログ文字盤("standard", "ticks", "alarm", "stopwatch")または フォント依存ゼロの 7 セグメントデジタル時計("digital")を描画します。

clock(
    xy: tuple[float, float],
    radius: float,
    *,
    variant: Literal[
        "standard",
        "ticks", "dial",
        "alarm",
        "stopwatch", "timer",
        "digital",
    ] = "standard",
    hour: float = 10.0,
    minute: float = 10.0,
    style: Style,
    text: str = "",
    text_style: Style | None = None,
) -> None

パラメータおよび variant リファレンス

パラメータ 型 デフォルト 説明
xy tuple[float, float] 必須 時計の文字盤またはデジタル筐体の中心座標 (x, y)。
radius float 必須 文字盤の半径(> 0)。variant="digital" の場合、角丸矩形筐体の幅は 1.8 * radius、高さは 1.0 * radius になります。
variant ClockVariant "standard" 時計のスタイル(下記の表を参照)。
hour float 10.0 時(0〜23)。アナログ系 variant では minute に連動して時針が滑らかに進みます(angle_hour = 90° - ((hour % 12) + minute / 60) * 30°)。variant="digital" ではゼロ埋め 2 桁の HH(int(hour) % 24)として表示されます。
minute float 10.0 分(0〜59)。アナログ系 variant では angle_minute = 90° - minute * 6° になります。variant="digital" ではゼロ埋め 2 桁の MM(int(minute) % 60)として表示されます。
style Style 必須 塗りつぶし、枠線、および回転(angle)を制御するスタイル。針・目盛り・7 セグメント数字は高い視認性を保つコントラスト色(濃色/フラット塗りでは白、淡色/ニュートラル塗りでは濃色)を自動選択します。
text / text_style str / Style | None "" / None xy の中央に配置される任意のテキストラベル。
variant 使用可能なエイリアス 視覚構成 主なユースケース
"standard" (デフォルト) — シンプルな円形文字盤+中心ピボット+時針・分針 ミニマルな cron/スケジュールアイコン、TTL インジケータ。
"ticks" "dial" 円形文字盤+放射状の 12 時間目盛り(12・3・6・9 時は太目盛り)+針 定期バッチジョブ、稼働時間クロック、時系列ウィンドウ。
"alarm" — 円形文字盤+12 目盛り+上部の双子ベル+下部の斜め脚 2 本 アラート閾値、PagerDuty/オンコール呼び出し、SLA 期限。
"stopwatch" "timer" 円形文字盤+12 目盛り+上部リューズ+右上 45° のサイドプッシャーボタン レイテンシ計測、リクエストタイムアウトバジェット、プロファイリングタイマー。
"digital" — 角丸矩形筐体(1.8r × 1.0r)+純ベクター 7 セグメント HH:MM 数字+コロンドット フォント依存ゼロかつ背景ゴーストセグメントのない正確なタイムスタンプ表示(00:00, 12:34, 23:59 など)。
from drawlib.canvas import save, setup
from drawlib.shapes import clock
from drawlib.styles import Styles
from drawlib.text import text

setup(width=130, height=48)

lbl = Styles.DarkBold.patch(text_size=9.5)

# 1. Standard minimal analog clock (10:10)
clock((15, 27), radius=8.8, variant="standard", hour=10, minute=10, style=Styles.Neutral)
text((15, 8.5), '"standard" (10:10)', style=lbl)

# 2. Ticks / dial analog clock (03:00)
clock((40, 27), radius=8.8, variant="ticks", hour=3, minute=0, style=Styles.PrimaryNeutral)
text((40, 8.5), '"ticks" (03:00)', style=lbl)

# 3. Alarm clock with twin bells & legs (07:30)
clock((65, 27), radius=8.2, variant="alarm", hour=7, minute=30, style=Styles.DangerNeutral)
text((65, 8.5), '"alarm" (07:30)', style=lbl)

# 4. Stopwatch / timer with top stem & side pusher (00:15)
clock((90, 27), radius=8.2, variant="stopwatch", hour=0, minute=15, style=Styles.SecondaryNeutral)
text((90, 8.5), '"stopwatch" (00:15)', style=lbl)

# 5. Font-free 7-segment digital clock (23:45)
clock((116, 27), radius=8.8, variant="digital", hour=23, minute=45, style=Styles.PrimaryFlat)
text((116, 8.5), '"digital" (23:45)', style=lbl)

save()
shapes_symbol_4
5 種類の時計 variant: standard・ticks(dial)・alarm・stopwatch(timer)・フォント不要 7 セグメント digital

5. 天体・テーマシンボル (sun, moon)

ライト/ダークテーマの切り替えアイコン、日中/夜間バッチ実行ウィンドウ、地理的な時間帯インジケータ向けに、sun と moon は複数の幾何バリエーションを提供します。

sun(
    xy: tuple[float, float],
    radius: float,
    *,
    variant: Literal[
        "rays", "standard",
        "ring",
        "beams",
    ] = "rays",
    num_rays: int = 8,
    style: Style,
    text: str = "",
    text_style: Style | None = None,
) -> None

moon(
    xy: tuple[float, float],
    width: float,
    height: float,
    *,
    variant: Literal[
        "crescent", "standard",
        "thin",
        "waxing",
        "half",
    ] = "crescent",
    mirror: bool = False,
    style: Style,
    text: str = "",
    text_style: Style | None = None,
) -> None
関数 パラメータ 型 デフォルト 説明
sun xy / radius tuple / float 必須 中心座標 (cx, cy) と光線先端までの外接半径(> 0)。内側の太陽円盤の半径は 0.54 * radius です。
variant SunVariant "rays" • "rays"("standard"): 中実の中心円盤の周囲に独立した num_rays 個の三角形光線を配置。
• "ring": 中空の円環リングの周囲に num_rays 個の三角形光線を配置。
• "beams": 中実の中心円盤の周囲に num_rays 本の矩形ビームバーを配置。
num_rays int 8 放射状の光線数(>= 3、通常は 8 または 12)。
moon xy / width / height tuple / float 必須 中心座標 (x, y) と厳密な外接水平幅・垂直高さ(> 0)。
variant MoonVariant "crescent" • "crescent"("standard"): バランスの良い定番の三日月。
• "thin": 深くえぐれた細身の三日月。
• "waxing": 内部に text を配置できる十分な広さを持つ厚みのある月。
• "half": 直線弦を持つ D 字型の半月。
mirror bool False デフォルト(mirror=False)では外側の凸弧が左(-X)を向き、先端が右(+X)を向きます。mirror=True で水平反転します。
from drawlib.canvas import save, setup
from drawlib.shapes import moon, sun
from drawlib.styles import Styles
from drawlib.text import text

setup(width=130, height=46)

lbl = Styles.DarkBold.patch(text_size=9.5)

# Sun variants (rays, ring, beams)
sun((14, 27), radius=8.8, variant="rays", num_rays=8, style=Styles.WarningFlat)
text((14, 8.5), 'sun("rays")', style=lbl)

sun((35, 27), radius=8.8, variant="ring", num_rays=8, style=Styles.WarningNeutral)
text((35, 8.5), 'sun("ring")', style=lbl)

sun((56, 27), radius=8.8, variant="beams", num_rays=10, style=Styles.PrimaryFlat)
text((56, 8.5), 'sun("beams")', style=lbl)

# Moon variants (crescent, thin, waxing, half)
moon((76, 27), width=13, height=16, variant="crescent", style=Styles.SecondaryNeutral)
text((76, 8.5), '"crescent"', style=lbl)

moon((93, 27), width=11, height=16, variant="thin", style=Styles.PrimaryNeutral)
text((93, 8.5), '"thin"', style=lbl)

moon((109, 27), width=14, height=16, variant="waxing", mirror=True, style=Styles.SecondaryNeutral)
text((109, 8.5), '"waxing"', style=lbl)

moon((123, 27), width=9, height=16, variant="half", style=Styles.Neutral)
text((123, 8.5), '"half"', style=lbl)

save()
shapes_symbol_5
太陽の variant(rays・ring・beams)と月の満ち欠け variant(crescent・thin・waxing・half)

6. ヘルスチェックハートとイベント稲妻ボルト (heart, lightning)

6.1. 死活監視・ヘルスチェックハート (heart)

heart は、サービスのヘルスチェック、SLA ステータスカード、ユーザーエンゲージメント指標向けに、滑らかな 3 次ベジェ曲線のハート("standard")または中央でひび割れて 2 分割されたハート("broken")を描画します。

heart(
    xy: tuple[float, float],
    width: float,
    height: float,
    *,
    variant: Literal[
        "standard", "classic",
        "broken",
    ] = "standard",
    style: Style,
    text: str = "",
    text_style: Style | None = None,
) -> None

6.2. サーバーレス・イベント稲妻ボルト (lightning)

lightning は、6 種類の幾何スタイル、水平反転(mirror=True)、および頂点の角丸め(style.shape_r)に対応した高電圧ボルト(稲妻)シルエットを描画します。

lightning(
    xy: tuple[float, float],
    width: float,
    height: float,
    *,
    variant: Literal[
        "standard",
        "flat",
        "double",
        "flat_double",
        "angled",
        "slanted",
    ] = "standard",
    mirror: bool = False,
    style: Style,
    text: str = "",
    text_style: Style | None = None,
) -> None
lightning の variant 上端形状 ジグザグ段数 主なユースケース
"standard" (デフォルト) 鋭い頂点 1 段の定番ボルト サーバーレス関数(Lambda/Cloud Functions)、Webhook/イベントトリガー、高速キャッシュヒット。
"flat" 水平なフラット上辺 1 段の定番ボルト 定番のバッテリー/充電アイコン、力強い産業用ハザードマーカー。
"double" 鋭い頂点 2 段のマルチジグザグボルト 高電圧サージ、連鎖するイベントストリーム、スパイクアラート。
"flat_double" 水平なフラット上辺 2 段のマルチジグザグボルト 高出力電源やバーストコンピュートのインジケータ。
"angled" / "slanted" 斜めに傾いた上辺 非対称なダイナミックボルト アクションのコールアウト、コミック/プレゼンテーション用のアクセント装飾。
from drawlib.canvas import save, setup
from drawlib.shapes import heart, lightning
from drawlib.styles import Styles
from drawlib.text import text

setup(width=132, height=46)

lbl = Styles.DarkBold.patch(text_size=9.5)

# 1. Heart variants ("standard" and "broken")
heart(
    (13, 27),
    width=17,
    height=16,
    variant="standard",
    style=Styles.DangerFlat,
    text="OK",
    text_style=Styles.WhiteBold.patch(text_size=9.5),
)
text((13, 8.5), 'heart("standard")', style=lbl)

heart((34, 27), width=17, height=16, variant="broken", style=Styles.DangerNeutral)
text((34, 8.5), 'heart("broken")', style=lbl)

# 2. All 6 Lightning variants
bolt_specs = [
    ("standard", 54, Styles.WarningFlat),
    ("flat", 69, Styles.PrimaryFlat),
    ("double", 84, Styles.WarningNeutral),
    ("flat_double", 99, Styles.PrimaryNeutral),
    ("angled", 113, Styles.SecondaryNeutral),
    ("slanted", 125, Styles.AccentFlat),
]
for var, cx, st in bolt_specs:
    lightning((cx, 27), width=10.5, height=19, variant=var, style=st)
    text((cx, 8.5), f'"{var}"', style=lbl)

save()
shapes_symbol_6
ハートの variant(standard・broken)と稲妻ボルトの全 6 種類 variant

7. ギア・歯車 (gear)

自動化エンジン、バックグラウンドワーカー、CI/CD ランナー、システム設定ノード向けに、gear は円弧状の歯底(ルートバレー)、調整可能な歯先/歯元比率、および任意の透明な中心穴を備えた N 枚の歯を持つ機械歯車を描画します。

gear(
    xy: tuple[float, float],
    num_teeth: int,
    radius_ext: float,
    radius_int: float,
    *,
    tooth_ext_ratio: float | None = None,
    tooth_int_ratio: float | None = None,
    hole_radius: float | None = None,
    style: Style,
    text: str = "",
    text_style: Style | None = None,
) -> None

パラメータリファレンス

パラメータ 型 デフォルト 説明
xy tuple[float, float] 必須 ギアの中心座標 (x, y)。
num_teeth int 必須 歯の数(>= 3、通常は 6〜12)。角度ピッチ pitch = 360° / num_teeth を決定します。
radius_ext float 必須 歯先の外周半径(> radius_int)。
radius_int float 必須 歯底の内周半径(0 < radius_int < radius_ext)。
tooth_ext_ratio float | None None 1 ピッチ角 pitch のうち 外側の歯先 が占める割合を (0.0, 1.0) で指定します。デフォルトは 0.35。tooth_ext_ratio <= tooth_int_ratio を満たす必要があります。
tooth_int_ratio float | None None 1 ピッチ角 pitch のうち 内側の歯元 が占める割合を (0.0, 1.0) で指定します。デフォルトは 0.55。tooth_int_ratio >= tooth_ext_ratio を満たす必要があります。
hole_radius float | None None 中央の透明な円形くり抜き穴の半径(0 < hole_radius < radius_int)。None(デフォルト)の場合は中実コアとなり、text の表示に適しています。
style Style 必須 塗りつぶし、枠線、回転(angle)、および歯の角丸め(shape_r: スカラー float または (4 * num_teeth) 要素タプル)を制御するスタイル。
text / text_style str / Style | None "" / None 中央配置されるテキストラベルと任意のタイポグラフィ上書き設定。

歯のジオメトリとカスタマイズルール

  • 台形歯と角歯の切り替え: デフォルト(tooth_ext_ratio=0.35, tooth_int_ratio=0.55)では、実際のインボリュート歯車のように外側に先細りする台形歯になります。両比率を同じ値(例: tooth_ext_ratio=0.48, tooth_int_ratio=0.48)にすると、側面が真っ直ぐな角歯になります。
  • 歯底円弧と角丸め(style.shape_r): style.shape_r が None の場合、歯底と歯先はそれぞれ半径 radius_int と radius_ext の正確な真円アークに沿います。style.shape_r を指定すると(例: Styles.PrimaryNeutral.patch(shape_r=0.8))、全 4 * num_teeth 箇所の歯の角が滑らかにフィレット処理されます。
  • 中実コアと中心穴の使い分け(hole_radius): ギア内部にテキストラベルを配置する場合は hole_radius を省略し、定番のリング型歯車にする場合は hole_radius(例: 0.4 * radius_int)を指定してください。
from drawlib.canvas import save, setup
from drawlib.shapes import gear
from drawlib.styles import Styles
from drawlib.text import text

setup(width=126, height=48)

# 1. Solid gear with embedded text (hole_radius=None)
gear(
    (18, 27),
    num_teeth=8,
    radius_ext=13.0,
    radius_int=9.8,
    style=Styles.PrimaryFlat,
    text="Worker",
    text_style=Styles.WhiteBold.patch(text_size=10.0),
)
text((18, 8), "hole_radius=None", style=Styles.DarkBold.patch(text_size=9.5))

# 2. Standard 8-tooth gear with center hole (tooth_ext_ratio=0.35, tooth_int_ratio=0.55)
gear(
    (49, 27),
    num_teeth=8,
    radius_ext=13.0,
    radius_int=9.5,
    hole_radius=4.2,
    style=Styles.PrimaryNeutral,
)
text((49, 8), "hole_radius=4.2", style=Styles.DarkBold.patch(text_size=9.5))

# 3. 12-tooth gear with wide square teeth (tooth_ext_ratio=0.48, tooth_int_ratio=0.48)
gear(
    (80, 27),
    num_teeth=12,
    radius_ext=13.0,
    radius_int=10.0,
    tooth_ext_ratio=0.48,
    tooth_int_ratio=0.48,
    hole_radius=5.0,
    style=Styles.SecondaryNeutral,
)
text((80, 8), "num_teeth=12 (square)", style=Styles.DarkBold.patch(text_size=9.5))

# 4. 6-tooth heavy gear with filleted tooth corners (shape_r=1.0)
gear(
    (110, 27),
    num_teeth=6,
    radius_ext=13.0,
    radius_int=8.8,
    tooth_ext_ratio=0.38,
    tooth_int_ratio=0.60,
    hole_radius=3.8,
    style=Styles.Neutral.patch(shape_r=1.0),
)
text((110, 8), "num_teeth=6, shape_r=1.0", style=Styles.DarkBold.patch(text_size=9.5))

save()
shapes_symbol_7
ギアのバリエーション: テキスト入り中実コア、標準の中心穴、細かい角歯、歯先の角丸め

8. 算術・比較演算子記号 (math_symbol)

視覚的な方程式やコンセプト数式([Card A] + [Card B] = [Outcome] など)向けに、math_symbol は細いフォントグリフではなく、塗りつぶしと枠線を持つ幾何図形として数学演算子を描画します。

math_symbol(
    xy: tuple[float, float],
    symbol: Literal[
        "+", "plus",
        "-", "−", "minus",
        "*", "x", "×", "multiply",
        "/", "÷", "divide",
        "=", "equal",
        "!=", "≠", "not_equal",
    ],
    width: float,
    height: float | None = None,
    *,
    thickness_ratio: float | None = None,
    style: Style,
    text: str = "",
    text_style: Style | None = None,
) -> None

パラメータリファレンス

パラメータ 型 デフォルト 説明
xy tuple[float, float] 必須 記号バウンディングボックスの中心座標 (x, y)。
symbol MathSymbol 必須 演算子記号または正規名(下記の 対応する symbol とエイリアス一覧 を参照)。
width float 必須 記号の外接水平幅(> 0)。
height float | None None 外接垂直高さ(> 0)。None の場合は width と同じ値(正方形のバウンディングボックス)になります。
thickness_ratio float | None None min(width, height) に対するバーの太さ比率を (0.0, 1.0) で指定します。デフォルトは 0.28。
style Style 必須 塗りつぶし、枠線、回転(angle)、およびバーの角丸め(shape_r: スカラー float)を制御するスタイル。
text / text_style str / Style | None "" / None 中央配置されるテキストラベルと任意のタイポグラフィ上書き設定。

対応する symbol とエイリアス一覧

基本 symbol 使用可能なエイリアス 幾何学的な構成
"+" "plus" 単一化された 12 頂点の直交十字輪郭(内部に重なり合う境界線なし)。
"-" "−", "minus" 垂直方向の中央に配置された 1 本の水平矩形バー。
"×" "*", "x", "multiply" 45° 回転し (width, height) に収まるようスケールされた単一の 12 頂点斜め十字輪郭。
"÷" "/", "divide" 中央の水平バーと上下の円形ドットを結合した複合パス(Path.make_compound_path)。
"=" "equal" 中心の上下に対称配置された 2 本の平行な水平バー。
"≠" "!=", "not_equal" 2 本の平行な水平バーと斜めのスラッシュを単一の外周輪郭に統合した図形。
from drawlib.canvas import save, setup
from drawlib.shapes import math_symbol, rectangle
from drawlib.styles import Styles
from drawlib.text import text

setup(width=124, height=58)

# Row 1: All 6 symbols (+, -, ×, ÷, =, ≠)
symbols = [
    ("+", 'symbol="+"', Styles.PrimaryFlat),
    ("-", 'symbol="-"', Styles.SecondaryNeutral),
    ("×", 'symbol="×"', Styles.PrimaryNeutral),
    ("÷", 'symbol="÷"', Styles.SecondaryNeutral),
    ("=", 'symbol="="', Styles.PrimaryFlat),
    ("≠", 'symbol="≠"', Styles.AccentFlat),
]

for idx, (sym, label, st) in enumerate(symbols):
    cx = 13 + idx * 19.6
    math_symbol((cx, 42), symbol=sym, width=12.5, style=st.patch(shape_r=0.5))
    text((cx, 30), label, style=Styles.DarkBold.patch(text_size=10.0))

# Row 2: Visual equation layout (Card + Card = Result Card)
rectangle(
    (24, 13),
    width=28,
    height=13,
    style=Styles.PrimaryNeutral.patch(shape_r=2),
    text="Latency",
    text_style=Styles.DarkBold.patch(text_size=10.5),
)
math_symbol((46, 13), symbol="+", width=7.5, thickness_ratio=0.32, style=Styles.SecondaryFlat.patch(shape_r=0.4))
rectangle(
    (68, 13),
    width=28,
    height=13,
    style=Styles.SecondaryNeutral.patch(shape_r=2),
    text="Jitter",
    text_style=Styles.DarkBold.patch(text_size=10.5),
)
math_symbol((90, 13), symbol="=", width=7.5, thickness_ratio=0.28, style=Styles.SecondaryFlat.patch(shape_r=0.4))
rectangle(
    (108, 13),
    width=20,
    height=13,
    style=Styles.PrimaryFlat.patch(shape_r=2),
    text="SLA",
    text_style=Styles.WhiteBold.patch(text_size=10.5),
)

save()
shapes_symbol_8
算術・比較演算子記号(+, -, ×, ÷, =, ≠)、太さ比率、ビジュアル数式レイアウト