※この翻訳ドキュメントはスクリプトによって出力・同期されています。内容が怪しそうな場合はGitHubにissueを追加したり英語の原文の確認をお願いします。

PathBezier3DContinual クラス

このページではPathBezier3DContinualクラスについて説明しるます。

クラス概要

PathBezier3DContinualクラスはパス上に連続した3次ベジェ曲線を設定するためのクラスです。

この設定は制御点に線対称位置を使用することで滑らかな曲線を描画します。

主にこの設定はPathクラスのコンストラクタとdraw_pathメソッドのインターフェイスで使用されます。

基本的な使い方

PathBezier3DContinualクラスのコンストラクタではcontrol_xcontrol_ydest_xdest_yの各引数の指定が必要になります。

control_xcontrol_yはベジェ曲線の2つ目の制御点の位置となります。

ベジェ曲線の2つ目の制御点の線対称の位置はPathBezier3DContinualクラスの1つ目の制御点の位置として設定されます。

そのためPathBezier3DContinualクラスのコンストラクタには1つ目の制御点の位置の指定の引数は存在しません。

dest_xdest_y引数はベジェ曲線の終点位置の指定となります。

PathBezier3DContinualクラスにはPathBezier3DPathBezier3DContinualクラスの直後でのみ使用できるという制限が存在します。

import apysc as ap

ap.Stage(
    background_color=ap.Color("#333"),
    stage_width=400,
    stage_height=420,
    stage_elem_id="stage",
)

path: ap.Path = ap.Path(
    path_data_list=[
        ap.PathMoveTo(x=50, y=200),
        ap.PathBezier3D(
            control_x1=50,
            control_y1=25,
            control_x2=200,
            control_y2=25,
            dest_x=200,
            dest_y=200,
        ),
        ap.PathBezier3DContinual(
            control_x=350,
            control_y=375,
            dest_x=350,
            dest_y=200,
        ),
    ],
    line_color=ap.Color("#0af"),
    line_thickness=5,
)

ap.save_overall_html(dest_dir_path="path_bezier_3d_continual_basic_usage_1/")

以下のコード例ではシアンの円は制御点(control_xcontrol_y)の位置を示し、マゼンタの円では終点の位置(dest_xdest_y)を示します。

import apysc as ap

ap.Stage(
    background_color=ap.Color("#333"),
    stage_width=400,
    stage_height=420,
    stage_elem_id="stage",
)

CONTROL_X: float = 350
CONTROL_Y: float = 375
DEST_X: float = 350
DEST_Y: float = 200

path: ap.Path = ap.Path(
    path_data_list=[
        ap.PathMoveTo(x=50, y=200),
        ap.PathBezier3D(
            control_x1=50,
            control_y1=25,
            control_x2=200,
            control_y2=25,
            dest_x=200,
            dest_y=200,
        ),
        ap.PathBezier3DContinual(
            control_x=CONTROL_X,
            control_y=CONTROL_Y,
            dest_x=DEST_X,
            dest_y=DEST_Y,
        ),
    ],
    line_color=ap.Color("#fff"),
    line_thickness=5,
)

RADIUS: int = 10

cyan_circle: ap.Circle = ap.Circle(
    x=CONTROL_X,
    y=CONTROL_Y,
    radius=RADIUS,
    fill_color=ap.Color("#0af"),
)

magenta_circle: ap.Circle = ap.Circle(
    x=DEST_X,
    y=DEST_Y,
    radius=RADIUS,
    fill_color=ap.Color("#f0a"),
)

ap.save_overall_html(dest_dir_path="path_bezier_3d_continual_basic_usage_2/")

相対座標設定

コンストラクタのrelativeのオプション引数はその挙動を変更します。

例として、もしその引数にTrueを指定した場合座標は相対座標として設定されます。

デフォルト値はFalseとなっており、この設定では絶対座標として扱われます。

基準となる位置は制御点などではなく始点の位置となります。

import apysc as ap

ap.Stage(
    background_color=ap.Color("#333"),
    stage_width=400,
    stage_height=420,
    stage_elem_id="stage",
)

path: ap.Path = ap.Path(
    path_data_list=[
        ap.PathMoveTo(x=50, y=200),
        ap.PathBezier3D(
            control_x1=50,
            control_y1=25,
            control_x2=200,
            control_y2=25,
            dest_x=200,
            dest_y=200,
        ),
        ap.PathBezier3DContinual(
            control_x=150,
            control_y=175,
            dest_x=150,
            dest_y=0,
            relative=True,
        ),
    ],
    line_color=ap.Color("#0af"),
    line_thickness=5,
)

ap.save_overall_html(dest_dir_path="path_bezier_3d_continual_relative/")

PathBezier3DContinual クラスのコンストラクタのAPI

特記事項: このAPIドキュメントはドキュメントビルド用のスクリプトによって自動で生成・同期されています。そのためもしかしたらこの節の内容は前節までの内容と重複している場合があります。

[インターフェイスの構造] __init__(self, control_x: Union[float, apysc._type.number.Number], control_y: Union[float, apysc._type.number.Number], dest_x: Union[float, apysc._type.number.Number], dest_y: Union[float, apysc._type.number.Number], *, relative: Union[bool, apysc._type.boolean.Boolean] = False, variable_name_suffix: str = '') -> None


[インターフェイス概要]

SVGの連続した3次ベジェ曲線(S)のためのパスデータのクラスです。


[引数]

  • control_x: float or Number

    • ベジェ曲線の制御点のX座標。

  • control_y: float or Number

    • ベジェ曲線の制御点のY座標。

  • dest_x: float or Number

    • 終点のX座標。

  • dest_y: float or Number

    • 終点のY座標。

  • relative: bool or Boolean, default False

    • パスの座標が相対座標として扱うかもしくは絶対座標として扱うかどうかの真偽値。

  • variable_name_suffix: str, default “”

    • JavaScript上の変数のサフィックスの設定です。この設定はJavaScriptのデバッグ時に役立つことがあります。


[コードサンプル]

>>> import apysc as ap
>>> stage: ap.Stage = ap.Stage()
>>> sprite: ap.Sprite = ap.Sprite()
>>> sprite.graphics.line_style(color=ap.Color("#fff"), thickness=3)
>>> path: ap.Path = sprite.graphics.draw_path(
...     path_data_list=[
...         ap.PathMoveTo(x=0, y=50),
...         ap.PathBezier3D(
...             control_x1=0,
...             control_y1=0,
...             control_x2=50,
...             control_y2=0,
...             dest_x=50,
...             dest_y=50,
...         ),
...         ap.PathBezier3DContinual(
...             control_x=100, control_y=100, dest_x=100, dest_y=50
...         ),
...     ]
... )

[関連資料]