Programing > p5.js > p5.play.js

p5.play.jsϡp5.jsѤΥ饤֥ǡץ饤ȤȽʤɤ򥵥ݡȤƤޤ

ѥեޥ󥹤ꥷץ뤵ͥ褷ƺƤꡢ3Dʪ󥸥ϥݡȤƤޤ

Ϥ

  1. ƥȥǥѰդ
  2. p5.js
  3. p5.play.js
  4. p5.jsp5.play.jsϡlibեƤ
  5. HTMLեѰդ
    <!DOCTYPE html>
    <html>
      <head>
        <title>p5.play Example</title>
        <script src="lib/p5.js" type="text/javascript"></script>
        <script src="lib/p5.play.js" type="text/javascript"></script>  
        <script src="sketch.js" type="text/javascript"></script>
      </head>
      <body>
      </body>
    </html>
  6. sketch.jsäơʥɤ򵭽Ҥ롣ϡHTMLեƱե֤
    function setup() {
     createCanvas(800,400);
     createSprite(400, 200, 50, 50);
    }
    
    function draw() {
     background(255,255,255);  
     drawSprites();
    }
  7. HTMLե򳫤

ץ

ĤäƤߤsketch.jsˡ򵭽Ҥ롣

ޥ

ޥΰ֤ˡץ饤ȤǻͳѤ

var img;

setup = function() {
	createCanvas(800,400);
	background(200);
	img = createSprite(400, 200, 50, 50);
}

draw = function() {
	img.position.x = mouseX;
	img.position.y = mouseY;
	drawSprites();
}

󥹥󥹥⡼ɤΥץ

P5.PLAY.JS󥹥󥹥⡼ɤư褦ˤʤäƤ

// instance mode example
var s = function(p) {

	var img;
	p.setup = function() {
		p.createCanvas(800,400);
		p.background(200);
		img = p.createSprite(400, 200, 50, 50);
	}

	p.draw = function() {
		img.position.x = p.mouseX;
		img.position.y = p.mouseY;
		p.drawSprites();
	}
}

var myp5 = new p5(s);

ͤˤʤ

Ϣڡ


  ȥå   ʬ Хåå   ñ측 ǽ   إ   ǽRSS
Last-modified: 2016-10-10 () 00:24:18 (890d)