Inkscapeでオブジェクトを扇形に配置する

ブログが作りたい!Inkscapeの使い方 > Inkscapeでオブジェクトを扇形に配置する

Inkscapeでオブジェクトを扇形に配置する

Inkscapeでオブジェクトを扇形に配置する

扇形に配置する奥義(なんつってぇ、なんつってぇ)

今回は、Inkscapeのオブジェクトを扇形に配置する方法について書きます。

オブジェクトの「整列 / 配置」機能で、一発で配置できるかと思ったのですが、さすがにそれはまだできないみたいです。(私が使っているInkscapeのバージョンは0.46です)

例えば、写真などを、こう・・・説明しにくいんですが、扇形に並べたいような場合の参考になるのではないかしら。良かったらご覧くださいませ。

これはオンリーワンの方法というわけではありません。「こんな風にしたらええのんちゃうかな」というお話。


扇形に配置した画像(完成例)

扇形(?)に配置した画像です。こんな感じで作成いたします。作成してみたい人は、適当な画像を何枚か用意してください。

影付きサンプル

Inkscapeでオブジェクトを扇形に配置する方法

1:Inkscapeを起動

(01)

Inkscapeを起動します。

Inkscapeを起動

2:画像をインポートする

(02)

上部メニュー「ファイル」から、「インポート」を選択しましょう。

上部メニュー「ファイル」から「インポート」を選択

(03)

「インポートするファイルを選択」画面が表示されます。

使用したい画像を選択(クリック)してください。

使用したい画像を選択(クリック)

(04)

右下の[Open]ボタンをクリックしましょう。

右下の[Open]ボタンをクリック

(05)

前述(03)で選択した画像が、インポート(挿入)されます。

「表示が小さいかな」という場合は、右下の表示倍率で調整しましょう。

同様に、前述(02)~(04)を繰り返し、使用する画像をすべてインポートしてください。(同じ場所に挿入されるので分かり難いかもしれません)

使用する画像をすべてインポート

(06)

インポートが済んだら、それぞれの画像を適当にばらばらに置きます。

各オブジェクトをドラッグ(&ドロップ)して、適当に移動させてください。

各オブジェクトをドラッグ(&ドロップ)して適当に移動

視覚的にすべて見えていなくても大丈夫であれば、移動しなくても構いません。(必ず移動させる必要はありません)

3:オブジェクトの角度をリセットする

(07)

オブジェクト(画像)を、すべて選択します。

キーボードの「ctrl」キーと「A」キーを、同時に打鍵しましょう。(「ctrl」+「A」)

キーボードの「ctrl」キーと「A」キーを同時に打鍵

(08)

オブジェクト(画像)が、すべて選択されるはずです。(小さい矢印が回りを囲みます)

オブジェクト(画像)が、すべて選択される

(09)

一度、角度をリセットします。(0度にしたい)

上部メニュー「オブジェクト」から、「変形」を選択しましょう。

上部メニュー「オブジェクト」から「変形」を選択

この「変形」画面は、あとでまた使うので、表示したままにしておいてください。よろしくどうぞ。

(10)

右側に「変形」画面が表示されます。「回転」タブをクリックしましょう。(もちろん、すでに「回転」タブが表示されている場合はクリックする必要はありません)

角度に「-90」を入力し、[Apply]ボタンをクリックしてください。

角度に「-90」を入力し、[Apply]ボタンをクリック

「-90(マイナスきゅうじゅう)」です。プラスではなく、マイナスですのでどうぞお間違いなきよう。

(11)

オブジェクト(画像)が、すべて横に寝転ぶはずです。

これで、それぞれのオブジェクト(画像)が、角度のない 0度の状態になったわけです。

それぞれのオブジェクト(画像)が、角度のない 0度の状態になった

4:オブジェクトの角度を設定する

(12)

それでは、今度はそれぞれのオブジェクト(画像)の角度を計算しておこうと思います。

今回は、180度を基準にして考えようと思います。

とりあえず、画像が5枚なので、単純に 180÷5で、36度の間隔にしてみます。(角度に余裕がないので、ぶかっこうになるかもしれませんけど)

  • 5枚目が、36度
  • 4枚目が、72度
  • 3枚目が、108度
  • 2枚目が、144度
  • 1枚目が、180度
5枚目が36度、4枚目が72度、3枚目が108度、2枚目が144度、1枚目が180度

(13)

まず、5枚目(一番右)に配置させたい画像を選択状態にします。

適当な白いところをクリックして、選択を解除してから、5枚目に配置させたい画像だけをクリックしましょう。

選択を解除してから、5枚目に配置させたい画像をクリック

選択の解除がうまくいかない場合は、上部メニュー「編集」から、「選択解除」をえらんでください。

(14)

「変形」画面は、表示したままでしたでしょうか。閉じてしまった人は、前述(09)で書いた方法で表示しなおしてください。

角度に「36」を入力し、[Apply]ボタンをクリックしましょう。

角度に「36」を入力し、[Apply]ボタンをクリック

(15)

5枚目に配置させたい画像が 36度傾きます。

5枚目に配置させたい画像が36度傾く

(16)

このようにして、各オブジェクト(画像)を選択し、それぞれ角度を入力していくと次のようになります。

それぞれの角度は、前述(12)でしめした通りです。できたら、「変形」画面は閉じてしまって構いません。

各オブジェクト(画像)を選択し、角度を入力しましょう

5:オブジェクトを配置する

(17)

各オブジェクトをうまいこと配置するために、ガイドライン(補助線)を使用します。

左側の定規のような目盛り(めもり)が描かれている箇所から、画像が表示されている右側へ適当にドラッグ(&ドロップ)してみてください。

左側の定規のような目盛り(めもり)が描かれている箇所から、画像が表示されている右側へ適当にドラッグ

ガイドライン(補助線)は、ドラッグしている間は赤い線、ドロップする(離す)と青い線になります。

(18)

縦にガイドラインがひけたはずです。次は、横にもガイドラインをひきます。

上側の定規のような目盛り(めもり)が描かれている箇所から、画像が表示されている下側へ適当にドラッグ(&ドロップ)してみてください。

上側の定規のような目盛り(めもり)が描かれている箇所から、画像が表示されている下側へ適当にドラッグ

(19)

ガイドライン(補助線)が、十字にひけたでしょうか。

オブジェクト内の左下の角を、このガイドラインの十字めがけてドラッグ(&ドロップ)してください。

ガイドラインの十字をめがけてオブジェクトをドラッグ

(20)

同様にすべてのオブジェクトを、ガイドラインめがけて移動させましょう。うまく角が吸着してくれるはずです。

同様にすべてのオブジェクトを移動

6:保存する

(21)

完成したら、一度 SVG保存しておきましょう。


扇形にするときの数値サンプル

入力する数値によって、形状が変わります。

1:サンプル1

  • 5枚目が、45度
  • 4枚目が、75度
  • 3枚目が、105度
  • 2枚目が、135度
  • 1枚目が、165度
5枚目が45度、4枚目が75度、3枚目が105度、2枚目が135度、1枚目が165度

2:サンプル2

  • 5枚目が、60度
  • 4枚目が、80度
  • 3枚目が、100度
  • 2枚目が、120度
  • 1枚目が、140度
5枚目が60度、4枚目が80度、3枚目が100度、2枚目が120度、1枚目が140度

3:サンプル3

  • 5枚目が、72度
  • 4枚目が、144度
  • 3枚目が、216度
  • 2枚目が、288度
  • 1枚目が、360度
5枚目が72度、4枚目が144度、3枚目が216度、2枚目が288度、1枚目が360度
前の記事へ
次の記事へ

次回予告

お疲れさまでした。次回は、GIMPに関する記事を書く予定です。(予定でしたが、画像をきれいに拡大できる?「SmillaEnlarger」について書きました)


関連記事

画像編集ソフトInkscapeに関連する記事を、ご紹介します。

作成日:2010/09/18 更新日:2010/09/18

コメントありがとうございます。

お手数ですが、コメント前に留意事項をご覧くださいませ。

また、現在ご質問にお答えする余裕がない状態にあります。よろしくお願いいたします。

コメントの投稿

内緒のときは、チェックしてください。

トラックバック

http://kumacrow.blog111.fc2.com/tb.php/674-7327746d
 | トップページ | 

FC2ブログの作り方・作成

GIMP2で画像を編集しよう

イラストが描ける Inkscape

初心者のためのSEO対策

Google Analytics入門

アクセス解析QLOOK

アイデアの作り方

超ビギナー向けHTML入門

超ビギナー向けのCSS入門

FC2ブログのカスタマイズ

初心者向けのCSS小技

Web制作に役立つ本

ブログでお小遣い稼ぎ

これはうまい!

誰にでも才能はあるのです

RSSフィード

プロフィール

KumaCrow(クマクロ)

KumaCrow

FC2ブログによるブログの作り方をご紹介しています。「初心者の人にも分かりやすく!」がモットーです。

Twitter KumaCrow

リンクフリー♪
フォローも、ふりっふり~

伝わる文章を書くコツ

最近の記事

最近のコメント

パソコン入門

アクセスの多かった記事

先月アクセスが多かった記事を、ご紹介します。

【1位】
GIMP2の使い方
【2位】
プリントスクリーンの方法
【3位】
GIMP2 パスの使い方
【4位】
GIMPとは?
【5位】
レイヤーとは?

初心者のデジカメ撮影術

ホームページ制作にJimdo

このブログの評価

自分を見つめなおす

ブログランキング

クリックしちゃいなよ!You、クリックしちゃいなよ!そして、Canして、Doしちゃいなよ!

FC2ブログランキングに参加してみませんか?見に来てくれる人が少しだけ増える・・・かもしれません。

FC2カウンター

ブログ開始(2007年7月)から、ユニークユーザ数が「のべ240万人」に達しました。いつもご覧いただきまして、ありがとうございます。(2011/01/05、FC2カウンター故障・データ消失により、10万人分くらいマイナスとなりました)

子どもの教育

最近のトラックバック

+++ お友達のブログ・お世話になっているサイトさま +++

ふわふわふわりん
無料ウェブ素材 Tyto-Style
海外のSEO対策・SEOツールをわかりやすく解説するブログ
日南商工会議所による情報化支援ブログ
気になるけど
聞き捨てならん!!
かちびと.net
ありのごとくあつまりて