スキップしてメイン コンテンツに移動

Blogger で p5js textarea scrollbar

この間のスクロールバー云々をBlogger上でデモ




<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.5.0/p5.js"></script><div id="p5canvas"></div>
<script>
let myTextArea;

function setup() {
  createCanvas(400, 300).parent("p5canvas");
  // init textarea
  myTextArea = createElement('textarea').parent("p5canvas");
  myTextArea.attribute("rows","5");
  myTextArea.attribute("cols","20");
  myTextArea.value('0\n1\n2\n3\n4\n5\n6\n7\n0\n1\n2\n3\n4\n5\n6\n7');
  myTextArea.position(20,20);
 }

function draw() {
  background(220);  
  text(" scrollTop "+myTextArea.elt.scrollTop ,20,280); 
}
</script>

コメント

このブログの人気の投稿

Blogger でp5jsがつかえた

”HTMLビュー”でHTMLを編集  divとcanvasを関連付ければ良いみたい (div id="p5canvas とcreateCanvasの.parent("p5canvas");) p5js本体はCDNを参照(https://cdnjs.com/libraries/p5.js) コードはP5サイトのEXAMPLEから(https://p5js.org/examples/3d-geometries.html) <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.5.0/p5.js"></script> <div id="p5canvas"></div> <script> function setup() { createCanvas(710, 400, WEBGL).parent("p5canvas"); } function draw() { background(250); translate(-240, -100, 0); normalMaterial(); push(); rotateZ(frameCount * 0.01); rotateX(frameCount * 0.01); rotateY(frameCount * 0.01); plane(70); pop(); translate(240, 0, 0); push(); rotateZ(frameCount * 0.01); rotateX(frameCount * 0.01); rotateY(frameCount * 0.01); box(70, 70, 70); pop(); translate(240, 0, 0); push(); rotateZ(frameCount * 0.01); rotateX(frameCount * 0.01); rotateY(frameCount * 0.01); cylinder(70, 70); pop(); ...

p5jsでpngをBase64文字列にしてコードに埋め込んでspriteに

Display String Blogger上でp5jsでsprites用の画像を扱うのが面倒そうなので 文字列にして埋め込んでみる 変換コードもコピペしたので残す  imageで読み込む際に文字列の頭にこれをつける'data:image/png;base64,' <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.5.0/p5.js"></script> <div id="p5canvas"></div> <script> let img; let spx=10; let spy=10; let timer=0; function setup() { createCanvas(400, 200).parent("p5canvas"); frameRate(30); img = loadImage('data:image/png;base64,'+ 'iVBORw0KGgoAAAANSUhEUgAAACAAAAAQCAMAAABA3o1rAAADAFBMVEUAiACIAIi7u7uqzO4AAAAzIiJEMzOId2aZiIi7qqrdzLv/7t3///9VEQB3EQCqIgDMMwD/RAD/dxH/uxH/3SL/7ncRIndEVf9mzP+I3f+7//+ZzO677v8zRBEzZhGI3QC7/wARmXciAEREEVXMZojumar/zN27RFXuu8x3MyKZRETMd2b/mZkzIhFVMyKIVUSZd1W7iGbMqnfuzKr/3cwiEQBEIhGqZiLMdzPdiETumVX/u2b/3Yjd3VURMzMRd3cRu7sR//93ZruZd+4zM2ZmZpmZiLvMu+7//+6ZmaqIiIj/AP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AAP8AA...

Arduino IDE が "Downloading index: library_index.tar.bz2" で固まる問題

PCとのシリアル通信が原因の一つらしい '/home/usename/.arduino15/packages' を消すといいらしい ので消すと治った IDEの起動中にフリーズしてたのが治った Downloading index: library_index.tar.bz2 とダウンロード中だったが終了したので起動中のフリーズが起こるようになった