Introduction to Processing

by jddevight

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/processing.js/1.6.6/processing.min.js"></script>
<script type="text/processing" data-processing-target="main">
void setup()
{
  size(400, 400);
  background(255);
  fill(255);
  noLoop();
  PFont fontA = loadFont("courier");
  textFont(fontA, 14);  
}

void draw(){  
  ellipse(200, 300, 150, 150);
  // text("Hello Web!",20,20);
  // println("Hello ErrorLog!");
}
</script>

<canvas id="main" style="width:400px;height:400px;border:1px solid black;">
  
</canvas>

CSS

body {
  background-color: white;
}