Contextfree.jsで遊ぶ

contextfree

Contextfree.jsおもしろい。

赤い円を描く

http://gyazo.com/f9393b636763c654ddb292937250b57b.png

startshape shape

rule shape {
  maru {x .05}
}

rule shape {
  maru {x -.05}
}

rule shape .1 { 
  maru {y .05}
}

rule shape .1 {
  maru {y -.05}
}

rule maru {
 CIRCLE{hue 0 sat 1 b .5 }
 CIRCLE{s .9 b 1}
 shape {s .8}
}

hue と sat(uration) と b(rightness) を一緒に指定しないと色が出ないのが難しかった。

手書き風のもじゃもじゃを描く

http://gyazo.com/7ec3d47c4f80ddb2abb1b870af11f41e.png

startshape shape

rule shape 1 {
 line {}
 shape {x .01 rotate 1}
}

rule shape 1 {
 line {}
 shape {x .01 rotate 0.5}
}

rule shape 8 {
  line {}
  shape {x .01 rotate 2 hue .03}
}

rule shape 2 {
  line {}
  shape {x .01 rotate 10 hue .03}
}

rule line {
  CIRCLE {s .02 sat .5 b .5 a -.1}
}

rule line {
  CIRCLE {s .018 sat .5 b .5 a -.1}
}

rule line {
  CIRCLE {s .022 sat .5 b .5 a -.1}
}

rotate を使うと渦巻き状のものが簡単にかける