<pa>エリアで人型ピクトグラムを乗せることもできるし、あとから<script>エリアで自転車を描いてる人型ピクトグラムを自転車に乗せる事ができます。
ダブルループのコードの数字をかえることで、いろいろな模様も描けます。

説明

① 描画エリアの設定

pa = 描画エリア（キャンバス）
id=”pa” → この名前でプログラムから操作できる
type=”n” → 通常の座標モード
scale=”1″ → 拡大率1倍
background-color=”#ffffff” → 背景色を白

② 自転車のフレームを描く

上のフレーム

<line id=“a” x1=“-172” y1=“112” x2=“-35” y2=“112” width=“5” color=“#222325”></line>

直線aを描く
始点 (-172,112)
終点 (-35,112)
太さ5
色黒

👉 自転車の上のパイプ

右フレーム

<line id=“b” x1=“128” y1=“112” x2=“115” y2=“-55” width=“5” color=“#222325”></line>

右側のフレーム

左三角

<line id=“c” x1=“-172” y1=“112” x2=“-35” y2=“-27” width=“5” color=“#222325”></line>

左の三角フレーム

下フレーム

<line id=“d” x1=“-35” y1=“-27” x2=“116” y2=“-27” width=“5” color=“#222325”></line>

自転車の下の棒

斜めフレーム

<line id=“e” x1=“-35” y1=“112” x2=“118” y2=“0” width=“5” color=“#222325”></line>

上から斜めのフレーム

シートポスト

<line id=“” x1=“-35” y1=“112” x2=“-35” y2=“-55” width=“5” color=“#222325”></line>

座席の棒

ペダル

<line id=“” x1=“-45” y1=“-55” x2=“-5” y2=“-55” width=“10” color=“#222325”></line>

クランク

ペダル右

<line id=“” x1=“115” y1=“-55” x2=“90” y2=“-60” width=“10” color=“#222325”></line>

右ペダル

③ 人（ピクトグラム）の作成

左の人

<hp id=“pic1” x=“-150” y=“200” scale=“0.5”

pic1 = 人
位置 (-150,200)
大きさ0.5

body=”0″

lua=”0″

lla=”0″

各パーツの角度

右の人

<hp id=“pic2” x=“150” y=“200”

もう一人

👉 車輪を描くための人

自転車の人

<hp id=“pic3” x=“-10” y=“-45”

自転車に乗るポーズ

④ ペンを手に持つ

pic1.PEN_HOLD(“LLA”);

左下腕にペンを持たせる

pic1.SK();

ペンをスケッチモード

pic1.penw(3);

ペンの太さ3

⑤ 車輪を描く（左）

for (let k = 0; k < 36; k++)

36回回転

👉 360度 / 10度

for (let i = 0; i < 4; i++)

4回

pic1.RW(“LUA”, 90, 0);

左上腕を

90度回転

👉 四角形

pic1.RW(“LUA”, 10, 0);

10度ずらす

👉 花模様

つまり

四角形 × 36回転

＝

車輪模様

⑥ 右の車輪

同じコードを

pic2

で実行

👉 右車輪

⑦ 細い線の模様

pic1.penw(1);

線を細く

pic1.RW(“LUA”, 900, 0);

900度回転

👉 模様を増やす

⑧ ペンを離す

pic1.PEN_RELEASE(“LLA”);

pic2.PEN_RELEASE(“LLA”);

ペンを手放す

⑨ 車輪を移動

pic1.MW(120, –220, 1);

左車輪移動

pic2.MW(85, 250, 1);

右車輪移動

pic3.MW(400, 0, 1);

人を移動

⑩ 人をリセット

pic1.C();

初期姿勢に戻す

⑪ 自転車に乗せる

pic1.SD();

描画開始

pic1.M(–10, –45, 1);

自転車の位置へ移動

次は

pic1.R(“BODY”, –30, 1);

体を傾ける

pic1.R(“LUA”, 50, 1);

pic1.R(“LLA”, 40, 1);

腕をハンドル位置

pic1.R(“LUL”, 70, 1);

pic1.R(“LLL”, –75, 1);

足をペダル位置

プログラム

自転車

ブログ作成者　Reiko　Sugiyama