p5をScrapboxで実行する

p5をScrapboxで実行する

(2019/1/20)

D3をScrapboxで実行することができるようにしたが、p5.jsという情報視覚化ライブラリもScrapboxから簡単に使える。
https://runp5.com/?p=masui/p5をScrapboxで実行する&c=p5.js のようなリンクをクリックすると別ウィンドウが開いて下の p5.js が実行されて表示される。ソースは https://github.com/masui/runp5 にある。
プログラミング練習問題集に例が沢山ある。

p5.js
Copied!
setup = () => {
$('<h2>').text('ランダムに点を打つ').appendTo($('body'))
createCanvas(400,400)
fill('#ffd')
strokeWeight(0)
rect(0,0,400,400)
}
draw = () => {
fill('#000')
rect(random(400),random(400),2,2)
}

実行結果:

Powered by Helpfeel