修正画布大小不受控制的问题，原因是Processing软件3.0.2版本中的settings()函数在Processing.js不认，因此pde文件中的size不能被processingjs解释，把size放到setup中即可。注意本地调试processingjs请用Firefox，Chrome和IE Edge不支持JavaScript本地访问外部文件。

tomriddle1234 · tomriddle1234 · commit 99c1167cb366 · 2016-03-22T10:55:39.000+08:00
diff --git a/jsExample.html b/jsExample.html
@@ -3,12 +3,6 @@
 	<head>
 		<title>JavaScript实例</title>
 		<script src="js/processing.min.js"></script>
-		<style type="text/css" rel="stylesheet">
-			.processingEle{
-				width: 640px ;
-				height: 480px;
-			}
-		</style>
 	</head>
 	
 	<body>
@@ -27,7 +21,7 @@
 			<button id="submitButton2" onclick="minusFunction()">减法提交</button>
 		</form>
 		
-		<canvas id="processingEle" data-processing-sources="sketch/demo.pde"></canvas>
+		<canvas id="processingEle" data-processing-sources="sketch/demo.pde" width=640px height=480px style='width:640px;height:480px'></canvas>
 		
 		<script>
 			function plusFunction()
diff --git a/sketch/demo.pde b/sketch/demo.pde
@@ -1,19 +1,17 @@
 float x = 0.0;
-void settings(){
-  size(640,480) ;
-}
 void setup(){
+  size(640,480) ;
   background(color(100,199,0)) ;
   frameRate(50) ;
   noStroke() ;
   fill(color(252,194,0)) ;
 }
 void draw(){
-  if (x >= width)
+  if (width/2 - 100 + x >= width)
   {
-    x = -width/2 ;
+    x = -width/2 -100;
   }
   background(color(100,199,0)) ;
   rect(width/2 - 100 + x, height/2 -100, 200,200) ;
-  x += 5.1 ;
+  x += 5 ;
 }
