Skip to content

Instantly share code, notes, and snippets.

@masakick
Last active May 1, 2016 07:42
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save masakick/35cbc49f68e07f6bd40adbe128a6aa33 to your computer and use it in GitHub Desktop.
Save masakick/35cbc49f68e07f6bd40adbe128a6aa33 to your computer and use it in GitHub Desktop.
basic_rotate02 | experiments for generating pattern like tokyo2020
license: gpl-3.0
<html>
<head>
<meta charset="UTF-8">
<title>basic_rotate02 | experiments for generating pattern like tokyo2020</title>
<script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.4.24/p5.min.js"></script>
<script language="javascript" type="text/javascript" src="sketch.js"></script>
<style> body {padding: 0; margin: 0;} </style>
</head>
<body>
</body>
</html>
var radius = 70;
var rectA = new p5.Vector(radius*Math.cos(15*Math.PI/180),radius*Math.sin(15*Math.PI/180));
var rectB = new p5.Vector(radius*Math.cos(30*Math.PI/180),radius*Math.sin(30*Math.PI/180));
var rectC = new p5.Vector(radius*Math.cos(45*Math.PI/180),radius*Math.sin(45*Math.PI/180));
function setup() {
createCanvas(900,900);
fill(30);
noStroke();
noLoop();
}
function draw() {
translate(width/2 - rectA.x/2,50);
for(var i =1; i<=12; i++){
drawRectOut(rectA);
translate(rectA.x,0);
rotate(15.0*PI/180);
drawRectIn(rectB);
translate(rectB.x,0);
if(i!=12)rotate(15.0*PI/180);
}
translate(0,rectB.y);
rotate(15.0*PI/180);
translate(0,rectC.y);
for(var i =1; i<=12; i++){
drawRectOut(rectC);
translate(rectC.x,0);
rotate(15.0*PI/180);
drawRectIn(swap(rectB));
translate(swap(rectB).x,0);
if(i!=12)rotate(15.0*PI/180);
}
translate(0,swap(rectB).y);
rotate(15.0*PI/180);
translate(0,swap(rectA).y);
for(var i =1; i<=12; i++){
drawRectOut(swap(rectA));
translate(swap(rectA).x,0);
rotate(30.0*PI/180);
}
}
function drawRectIn(vec){
beginShape();
vertex(0,0);
vertex(vec.x,0);
vertex(vec.x,vec.y);
vertex(0,vec.y);
endShape(CLOSE);
}
function drawRectOut(vec){
beginShape();
vertex(0,0);
vertex(vec.x,0);
vertex(vec.x,-vec.y);
vertex(0,-vec.y);
endShape(CLOSE);
}
function swap(vec){
var swappedVec = new p5.Vector(vec.y,vec.x);
return swappedVec;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment