InkscapeでDesign- パスの変形

HOME > 上級編 > エクステンション > パスの変形

エクステンション

パスの変形

エクステンションの基本については・・・

エクステンションとは

3Dのエッジ

オブジェクトにハイライトとシャドウを重ねて、3Dっぽくするエクステンションです。

使い方

各シェイプオブジェクト（）とテキストオブジェクト（）は、先にパスに変換する必要があります。

メニューバーの[エクステンション]メニューより、[パスの変形]-[3Dのエッジ]を選択してダイアログを開き、下記の各項目を設定後、パスを選択して[適用]を押します。

①照明角度

光源の方向を設定します。

②シェード

グレースケールの階調の数を設定します。
2を設定すると、黒と白のみ、3を設定するとグレーが加わります。以降、4、5・・・と増えるごとにグレーの階調が増えていきます。
ただし、階調の境界は、ノードの位置になりますので、階調数に応じてノードを増やす必要があります。

③黒と白のみ

チェックを入れておくとグレーの部分が無くなります。（※［シェード］を「2」に設定している場合は、もともとグレーの部分がないので変化はありません。）
下記の例では、［シェード］：3に設定すると、左上角と右下角にグレーが追加されています。［黒と白のみ］のチェックを入れると、そのグレーの部分が削除されています。

④ストローク幅

変更不要（数値を変更しても、常に10.0で作成されます。）

⑤ぼかしの標準偏差

数値が大きい程、ハイライトとシャドウのぼけ具合が大きくなります。

⑥ぼかしの幅⑦ぼかしの高さ

ぼかしが計算される領域ですが、あまり有用な項目ではないので、初期設定値（2.0）のままで良いようです。

光と影を表すパーツのしくみ

例えば下記のパスに適用する場合・・・

元のパスの複製にストロークが設定されます。ストロークは、ノードの位置で、設定した階調数（＝シェード）に応じて分割され、白、グレー、黒に設定されます。（A）
ぼかしの標準偏差の値に応じてぼかしが設定され（B）、元のパスの複製でクリップされます（C）
これで光と影のパーツができました（D）
これを元のパスに重ねてできあがり。

エンベロープ

パスを、選択した四辺形の形に変形するエクステンションです。

使い方

各シェイプオブジェクト（）とテキストオブジェクト（）は、先にパスに変換する必要があります。
オブジェクトが複数ある場合は、複合パス化、またはグループ化しておきます。

①変形するパス、②四辺形の順に選択後、メニューバーの[エクステンション]メニューより、[パスの変形]-[エンベロープ]を選択します。

反転や回転してしまうときは

四辺形のパスの開始位置と方向によっては反転や回転してしまう場合があります。パスの向きを逆にするか、四辺形を回転、または作成し直します。

パスの開始位置と方向を確認するには

パスから生成 > 補間 > パスの向きと開始位置を確認するには

四辺形の中におさまらないときは

グループ化しているパスが四辺形の中にきちんとおさまらなかったり、全然違う場所へ移動してしまったりする場合は、グループ化を一度解除してからもう一度かけなおすとうまくいくと思います。
（※これは、グループ化オブジェクトを移動したときに付いたtransform属性をリセットする意味があります。）

グループに属性を挿入

グループ、又は同時に選択している複数のオブジェクトに、指定した[属性（下図①または②）]を段階的に変化させて挿入します。

重なりの順序が最背面のオブジェクトに［開始値（下図⑤）］があてられ、前面に行くに従って段階的に値を変化させ、最終的に最前面のオブジェクトに［終了値（下図⑥）］が挿入されます。

オブジェクトの重なり順は［XMLエディター］で確認できます。（XMLエディター上では、リストの下に行くほど重なり順は上になります。）

XMLエディターの使い方については・・・

XMLエディター

オブジェクトの重なり順を変えるには・・・

重なりの順序を変更する

適用例

下記に、重なり順が左から右に順に上に重なるようにオブジェクトを配置し、全てを選択しました。
これに、[グループに属性を挿入]を適用していきます。

フィル属性を挿入し、段階的に色を変化させてみます。

設定内容は下記のようにしました。

［挿入する属性（上記①）］：フィル
［適用先（上記④）］：スタイル
［開始値（上記⑤）］：#008080（）
［終了値（上記⑥）］：#ff5555（）
［単位（上記⑦）］：単位なし

次に、Y軸移動を挿入し、Y方向の位置を段階的に変化させてみます。

設定内容は下記のようにしました。

［挿入する属性（上記①）］：Y軸移動
［開始値（上記⑤）］：0
［終了値（上記⑥）］：100
［単位（上記⑦）］：単位なし

ゴム状引き伸ばし

パスをゴムみたいに引き伸ばすエクステンションです。

使い方

カーブを付けたい直線にはあらかじめスムーズタイプのノードを追加しておきます。
例えば下記の複合パスに適用する場合、外側の直線部分は、このままではカーブが付きません。
各辺にスムーズタイプのノードを3つずつ追加しました。

パスを選択後、メニューバーの[エクステンション]メニューより、[パスを変形]-[ゴム状引き伸ばし]を選択してダイアログを表示し、各設定後[適用]を押します。

設定を変えて適用すると・・・

セグメントの直線化

パスのセグメントのカーブの部分を直線に近付けるエクステンションです。

使い方

パスを選択後、メニューバーの[エクステンション]メニューより、[パスを変形]-[セグメントの直線化]を選択してダイアログを表示し、各設定後[適用]を押します。

[パーセント]の数値が大きいほど直線に近付きます。
[振る舞い]は、ハンドルの位置と向きに関する設定で、「1」「2」の2種類から選べます。ノードの部分の丸みに少し違いが出ます。

[1]のとき：ハンドルは方向を変えずにノードの方へ移動します。
[2]のとき：隣接するノードとの間の1/3の地点へ向かって移動します。

ノードの追加

パスのセグメント内に、等間隔にノードを追加します。

パスを選択後、メニューバーの[エクステンション]メニューより、[パスを変形]-[ノードの追加]を選択してダイアログを表示し、各設定後[適用]を押します。

「最大セグメント長」による設定と、「セグメント数」による設定

[除算法]を[最大セグメント長による]に設定する場合、[最大セグメント長]で指定した数値以内の一番長い長さで間隔が設定されます。
例えば下記のように、[最大セグメント長]を30に設定すると、左側のセグメントには、29.50pxの間隔で、右側のセグメントには、27.83pxの間隔でノードが追加されました。
[除算法]を[セグメント数]に設定する場合は、長さに関わらず、設定されたセグメント数になるようにノードが追加されます。