inkscapeで斜めに並ぶパターンを作ってみました。
inkscapeでパターンの登録をすると、絵が隙間なくビッシリと並べられてしまいます。 それを防ぐためには、以前投稿したように土台の四角形を作ります。 土台の四角形に絵を1つだけ置いた場合、縦横に整列したパターンになります。 斜めに並べるには次のように、2×2マスの土台に2つの絵をのせてパターン登録します。
土台のサイズやオブジェクトの位置はツールバーで数値入力をするとズレなくて良いです。
土台の四角形は便宜上色をつけていますが、実際の作業では塗りつぶし無しの透明にします。 土台の四角形に色が付いていると、SVGを拡大縮小したときにアラができるので注意。 アラがないように塗りつぶす方法は以前の投稿を見てください。
絵を2つ登録するやり方だと簡単に出来るのですが、2重に登録しなければならない分パターンのコードサイズも2倍になってしまいます。 複雑な絵をパターンにするときは、別のやり方で省サイズにしましょう。
使う絵は次の図形。
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 111.79 137.11" id="svg2"><defs id="defs4"/><g transform="translate(-26.94278,-75.748299)" id="layer1"><path d="m 76.19,177.29 c -10.42,-10.42 -16.235,-23.1 -48.435,-33.81 39.183,32.005 14.703,45.738 37.382,61.599 6.0073,4.2011 7.7534,6.5443 16.46,6.9526 5.9189,0.27762 5.3694,-3.8135 5.6439,-11.178 0.436,-11.68 -2.125,-14.63 -11.051,-23.56 z" style="fill:#008000;fill-rule:nonzero"/><path d="m 52.091,163.67 c 9.4583,12.658 14.441,38.758 33.201,48.154 l 1.5806,-2.483 c -22.178,-16.51 -17.809,-26.44 -34.782,-45.67 z" style="fill:#005a00;fill-rule:nonzero"/><path d="m 75.865,203.95 c -7.4663,-1.6512 -12.659,-3.5937 -20.479,-10.402 1.8011,5.0252 5.9259,9.6566 9.7518,11.54 4.707,3.8761 14.203,9.2038 21.011,6.3025 l 1.418,-5.9775 c -3.3933,0.87113 -8.5662,-0.76923 -11.702,-1.4628 z" style="fill:#005000;fill-rule:nonzero"/><path d="m 76.19,177.29 c -8.145,-8.79 -16.235,-23.1 -48.435,-33.81 12.765,12.102 18.391,17.035 20.654,24.827 0.11118,-5.7035 -0.66284,-8.2615 -3.5437,-13.16 9.4803,5.1484 18.214,11.831 31.324,22.14 z" style="fill:#ffffff;fill-opacity:0.25098039;fill-rule:nonzero"/><path d="m 76.19,177.29 c -10.42,-10.42 -16.235,-23.1 -48.435,-33.81 39.183,32.005 14.703,45.738 37.382,61.599 6.0073,4.2011 7.7534,6.5443 16.46,6.9526 5.9189,0.27762 5.3694,-3.8135 5.6439,-11.178 0.436,-11.68 -2.125,-14.63 -11.051,-23.56 z" style="fill:none;stroke:#005a00;stroke-width:1.62530804;stroke-miterlimit:4;stroke-dasharray:none"/><rect width="4.8685999" height="86.134003" x="81.566002" y="123.64" style="color:#000000;fill:#00a000;stroke:#005a00;stroke-width:1.63269997;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;enable-background:accumulate"/><path d="m 96.772,87.939 c 3.1707,-10.021 15.201,-17.779 10.727,-3.7382 -1.9636,6.1629 -2.1877,15.183 -2.1129,27.955 0.043,7.3304 -1.2623,12.111 -8.3338,12.479 -10.005,0.52007 -3.0162,-3.6471 -2.8808,-11.016 0.21467,-11.686 0.32364,-18.484 2.6005,-25.68 z" style="fill:#e60000;stroke:#800000;stroke-width:1.62530804;stroke-miterlimit:4;stroke-dasharray:none"/><path d="m 107.45,78.5 c -1.6107,-1.2504 -5.6282,3.0952 -7.8015,5.526 3.9922,-6.9267 8.396,-7.6448 7.8015,-5.526 z" style="fill:#ffffff;fill-opacity:0.25098039;fill-rule:nonzero"/><path d="m 62.99,84.569 c 2.1955,-10.021 9.5722,-11.033 19.341,0 5.0252,5.6754 3.9884,16.483 4.0633,29.256 0.04295,7.3304 -0.1156,11.249 -7.1961,11.341 -15.044,0.19501 -16.096,-3.4884 -16.371,-10.853 -0.43545,-11.686 -1.4528,-22.371 0.16253,-29.743 z" style="fill:#ff0000"/><path d="m 77.57,81.647 -1.8326,1.5891 c -10.169,-7.361 -10.245,2.2 -12.632,11.738 0.334,-12.61 2.786,-23.772 14.465,-13.327 z" style="fill:#ffffff;fill-opacity:0.25098039;fill-rule:nonzero"/><path d="m 63.965,80.018 c 1.3829,4.932 -1.1191,8.3965 4.3883,14.79 -2.6899,7.2027 -3.1629,9.0065 -3.0881,17.716 0.06298,7.3302 1.9973,9.2988 10.845,12.641 -12.443,0.19501 -13.008,-3.4884 -13.283,-10.853 -0.43545,-11.686 -2.428,-26.759 1.1377,-34.294 z" style="fill:#000000;fill-opacity:0.25098039"/><path d="m 62.99,84.569 c 2.1955,-10.021 9.5722,-11.033 19.341,0 5.0252,5.6754 3.9884,16.483 4.0633,29.256 0.04295,7.3304 -0.1156,11.249 -7.1961,11.341 -15.044,0.19501 -16.096,-3.4884 -16.371,-10.853 -0.43545,-11.686 -1.4528,-22.371 0.16253,-29.743 z" style="fill:none;stroke:#800000;stroke-width:1.62530804;stroke-miterlimit:4;stroke-dasharray:none"/><path d="m 75.711,84.787 c 10.42,-10.42 12.334,-10.745 22.754,-0.32506 8.926,8.926 7.4016,17.133 6.8263,29.743 -0.33409,7.3229 2.6474,11.249 -20.036,11.178 -15.045,-0.0469 -19.672,-3.4884 -19.947,-10.853 -0.43545,-11.686 1.476,-20.817 10.402,-29.743 z" style="fill:#ff0000;fill-rule:nonzero"/><path d="m 65.217,107 c 2.3865,10.901 12.911,11.65 22.252,11.655 9.4449,0.005 13.156,3.5309 18.219,-6.6168 2.5915,15.979 -6.8544,12.919 -23.449,13.454 -21.173,0.68234 -19.855,-1.2822 -20.678,-24.872 5.05,22.121 4.3203,8.5196 3.6569,6.3793 z" style="fill:#000000;fill-opacity:0.39215686;fill-rule:nonzero"/><path d="m 75.992,86.194 c 10.42,-10.42 11.36,-11.393 23.079,0 5.8379,5.6754 5.6137,14.37 5.0385,26.98 -1.47,-17.865 3.43,-22.938 -19.223,-24.087 -13.745,-0.697 -16.259,10.977 -18.159,26.527 -0.435,-11.68 0.338,-20.49 9.264,-29.416 z" style="fill:#ffffff;fill-opacity:0.25098039;fill-rule:nonzero"/><path d="m 75.711,84.787 c 10.42,-10.42 12.334,-10.745 22.754,-0.32506 8.926,8.926 7.4016,17.133 6.8263,29.743 -0.33409,7.3229 2.6474,11.249 -20.036,11.178 -15.045,-0.0469 -19.672,-3.4884 -19.947,-10.853 -0.43545,-11.686 1.476,-20.817 10.402,-29.743 z" style="fill:none;stroke:#800000;stroke-width:1.62530804;stroke-miterlimit:4;stroke-dasharray:none"/><path d="m 89.482,177.21 c 10.42,-10.42 16.235,-23.097 48.434,-33.806 -39.183,32.005 -14.703,45.738 -37.382,61.599 -6.0073,4.2011 -7.7534,6.5443 -16.46,6.9526 -5.9189,0.27761 -5.3694,-3.8135 -5.6438,-11.178 -0.43545,-11.686 2.1261,-14.641 11.052,-23.567 z" style="fill:#008000;fill-rule:nonzero"/><path d="m 113.91,166.19 c -9.4583,12.658 -15.091,33.232 -33.526,45.554 l -1.5806,-2.483 c 21.852,-18.788 18.134,-23.844 35.107,-43.071 z" style="fill:#005a00;fill-rule:nonzero"/><path d="m 89.807,203.87 c 12.828,-4.7985 14.61,-6.1942 28.28,-38.357 -10.578,24.854 -0.39989,23.634 -17.553,39.495 -5.6822,5.8264 -14.203,9.2038 -21.011,6.3025 l -1.418,-5.9775 c 3.3933,0.87114 6.8667,0.34608 11.702,-1.4628 z" style="fill:#005000;fill-rule:nonzero"/><path d="m 89.482,177.21 c 10.42,-10.42 16.235,-23.097 48.434,-33.806 -32.032,19.003 -24.646,15.894 -44.533,36.894 -8.6746,9.16 -12.512,10.006 -14.953,20.479 -0.43545,-11.686 2.1261,-14.641 11.052,-23.567 z" style="fill:#ffffff;fill-opacity:0.25098039;fill-rule:nonzero"/><path d="m 89.482,177.21 c 10.42,-10.42 16.235,-23.097 48.434,-33.806 -39.183,32.005 -14.703,45.738 -37.382,61.599 -6.0073,4.2011 -7.7534,6.5443 -16.46,6.9526 -5.9189,0.27761 -5.3694,-3.8135 -5.6438,-11.178 -0.43545,-11.686 2.1261,-14.641 11.052,-23.567 z" style="fill:none;stroke:#005a00;stroke-width:1.62530804;stroke-miterlimit:4;stroke-dasharray:none"/></g></svg>
チューリップです。 bloggerにSVGファイルをアップロードできないのでコードを載せます。 SVGで見たい人はテキストエディタにコピー&ペーストして使ってください。 空白は削ってますので、コードを読みたいときは別のインデントしてくれるツールで見てください。 inkscapeで作ってプレーンSVGで出力。 コード中のいらなそうな要素をテキストエディタで消しています。 win版inkscape 0.47では読み込めました。 他の環境で読めなかったらゴメンナサイ。
前の例は2×2マスの土台を使いました。 今回は少し大きめの1×1マスでパターンを作ります。 正方形の土台の真ん中あたりにチューリップを乗せましょう。 そして変形ダイアログでチューリップのみ左に45度回転。
土台を透明にしてから、チューリップと土台をパターンに登録します。 パターン全体の角度を右に45度回転させれば斜めに並ばせることができます。 「ノードでパスを編集」でパターン右上の角の丸をドラッグして調節しましょう。 ちょうど45度回転させるのは、Ctrlキーを押しながらドラッグすれば簡単です。
塗りつぶしたいオブジェクトに登録したパターンを適用したら完成です。 こんな感じになります。
上の画像では土台を透明にしないでやってます。 説明用の画像を用意するときに楽だから。 しかし、そうするとパターンのつなぎ目に菱形のアラができます。 以前の投稿のように背景色は別に塗った方が良さそうです。 一応チューリップ自体にアラは出ませんでしたが、もし気になるなら左上のバッテンをドラッグしてパターンの中央にチューリップが来るよう調節しましょう。
パターンの角度や位置を調節中に試し塗りをしないように注意しましょう。 以前に投稿したように、変形パターンのコピーが作られて面倒なことになります。 塗りつぶしに使う前にパターンの調節を終えてしまいましょう。 塗った後にパターンの修正がしたくなったときは、アンドゥで塗りつぶし前に戻ってからにします。 なぜそんな面倒なことをするかは、以前の投稿の文章を眺めていただければ分かるかと。
でお買い物
