Natural History ナチュラル ヒストリー 【 博物誌 】
  • svg で描いちゃう！書き方おぼえがき vol.08 【 複合パス 】 2018/08/02 svg 続きを読む
    フリーのイラストを書くのは、実務にはむいてないけど、複合パスは、簡単で実務でも効果的に使えそうです！複合パス＜path class="cls-1" d="M25,25H175V175H25V25ZM50,100A50,50,0,0,0,150,100,50,50,0,0,0,50,100Z"/＞ベースのパスに複合させるパスを続けて記述します。複合させるパスの基点 M は、直前のパスの終点から相対座標にすることも可能です。ベースのオブジェクト 〜 時計回り複合させるオブジェクト 〜 反時計回りの... 続きを読む
  • svg で描いちゃう！書き方おぼえがき vol.07 【 スプライン曲線 T・t 】 2018/08/01 svg 続きを読む
    この T・t は、Illustrator からの書き出しでは出現しませんでした。使わなくてもいいんじゃないか？ と感じます。こんな曲線も引けるんだって思っといてください。T・t ：スプライン曲線＜path class="cls-1" d="M50,100t30-15,40,15,40,15,30-15c0-40-40-60-70-60S50,70,50,100Z"/＞頂点を記述します。3つの頂点を通る二次曲線でセグメントを描画します。＜path class="cls-1" d="M50,100 t30-15,40,15,40,15,30-15c0-40-40-60-7... 続きを読む
  • svg で描いちゃう！書き方おぼえがき vol.06 【 二次曲線 Q・q 】 2018/08/01 svg 続きを読む
    二次曲線とスプライン曲線は・・・数学ですね。こんなとき、もっと数学をやっておけばよかったとひしひしと感じます。でも二次曲線を理解してなくても大丈夫！私もよくわかってません！！では、得意のビジュアルで！！！だって、絵をかくんだもん！！！！どちらもハンドル操作ではなく、自動で引かれる曲線です。自由に動かすには不向きかも?図形や、アニメーションの軌道を書いたりには便利そうです。それでは！！Q・q ：二次曲線... 続きを読む
  • svg で描いちゃう！書き方おぼえがき vol.05 【 円弧 A・a 】 2018/08/01 svg 続きを読む
    どんどんいきましょう！A・a ：円弧＜path class="cls-3" d="M200,100q35,35,0,70-35,35,0,70a80,80,0,0,0,0-140Z"/＞A の直前の座標が円弧の基点。以後 5つの数値が円弧の設定です。1 ：次の 2つの数値は、円の x軸半径，y軸半径。2 ：次の 3つの数値は、円弧の指定。3 ：終点の座標。円弧の設定と終点でセグメントを描画します。＜path class="cls-3" d="M200,100q35,35,0,70-35,35,0,70a80,80,0,0,0,0-140Z"/＞Q・q ：二次曲線 ... 続きを読む
  • svg で描いちゃう！書き方おぼえがき vol.04 【 直線 L・l、H・h、V・v 】 2018/08/01 svg 続きを読む
    直線の書き方です。いっぺんにいっちゃいます！L・l ：ハンドルを持たない直線H・h ：水平線V・v ：垂直線＜path class="cls-1" d="M50,120h140v-100L50,120Z"/＞H は、x 座標のみ指定。V は、y 座標のみ指定。L は、次のアンカーの座標を指定します。それぞれ 1点でセグメントを描画します。＜path class="cls-1" d="M50,200h150v-100L50,200Z"/＞書き方のバリエーション相対座標＜path class="cls-1" d="M50,120h140v-100l-140,1... 続きを読む
次のページ

mayahuel

ブログ内検索


最近の記事

カテゴリー

カレンダー

11 | 2023/12 | 01
日 月 火 水 木 金 土
- - - - - 1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31 - - - - - -

月別アーカイブ