模様(もよう)をSVG(エスブイジー)にする

青海波せいがいはという模様もようを SVG にしてみました。

青海波せいがいは

このような繰くり返かえしの模様もようを SVG で作つくるのは結構けっこう大変たいへんです。

一ひとつの波なみだけならこんな感かんじです。

<svg id="Pattern" xmlns="http://www.w3.org/2000/svg" width="640" height="400">
    <rect x="0" y="0" width="640" height="400" style="fill:#fff"></rect>
    <path d="M0,0A30,30 0 0 1 60,0" style="stroke-width: 2.4;" stroke="#008080" fill="#ffffff"></path>
    <path d="M6,0A24,24 0 0 1 54,0" stroke="#008080" fill="#ffffff" style="stroke-width: 2.4;"></path>
    <path d="M12,0A18,18 0 0 1 48,0" stroke="#008080" fill="#ffffff" style="stroke-width: 2.4;"></path>
    <path d="M18,0A12,12 0 0 1 42,0" stroke="#008080" fill="#ffffff" style="stroke-width: 2.4;"></path>
</svg>

これを少すこしずつ、ずらしながらたくさん描かいていきます。

詳くわしくはブログ「JavaScript (71) 青海波せいがいは」をお読よみください。