2d:null 2e:["$","title",null,{"children":"Selected Systems | John C | Observable"}] 33:Tc03,p5(s => { const rule = [3,4,3,4,0.1]; let cols = 120,rows = 80; let grid = (() => { let tem = new Array(cols); for (let i = 0; i < tem.length; i++) { tem[i] = new Array(rows); } return tem; })() let size = 5; s.setup = function () { s.createCanvas(600,400); for (let i = 0; i < grid.length; i++) { for (let j = 0; j < grid[i].length; j++){ let coin = s.random(1); if (coin < rule[4]) { grid[i][j] = 1; } else { grid[i][j] = 0; } } } s.frameRate(15); } s.draw = function () { s.background(255,8); s.noFill(); s.strokeWeight(0.5); let alive = [] grid.forEach((col,x) => { col.forEach((c,y) => { if (c) { alive.push({x:x* size + size/2,y:y*size + size/2}); } }); }); if (alive.length >= parseFloat(ctc[0]) * cols * rows) s.noLoop(); let aliveDelaunay = d3.Delaunay.from(alive.map(o =>[o.x, o.y])); let aliveVor = aliveDelaunay.voronoi([-1,-1,s.width+1,s.height+1]); for (let i = 0, n = aliveDelaunay.halfedges.length; i < n; i++) { let j = aliveDelaunay.halfedges[i]; if (i < j) continue; let vi = Math.floor(i / 3) * 2; let vj = Math.floor(j / 3) * 2; let d = s.dist(aliveVor.circumcenters[vi], aliveVor.circumcenters[vi + 1], aliveVor.circumcenters[vj], aliveVor.circumcenters[vj + 1]); s.stroke(s.map(d,10,400,50,150),s.map(d,10,400,200,100)); s.line(aliveVor.circumcenters[vi], aliveVor.circumcenters[vi + 1], aliveVor.circumcenters[vj], aliveVor.circumcenters[vj + 1]); } updateGrid(); //s.noLoop(); } const updateGrid = function () { let next = (() => { let tem = new Array(cols); for (let i = 0; i < tem.length; i++) { tem[i] = new Array(rows); } return tem; })() for (let i = 0; i < cols; i++) { for (let j = 0; j < rows; j++){ let pre = grid[i][j]; let sum = count(grid, i, j); if (pre) sum--; let nxt; if (pre) { if (sum >= rule[0] && sum <= rule[1]) { nxt = 1; } else { nxt = 0; } } else { if (sum >= rule[2] && sum <= rule[3]) { nxt = 1; } else { nxt = 0; } } next[i][j] = nxt; } } grid = next; } const count = function (grid, i, j) { let sum = 0; for (let k = -1; k < 2; k++) { for (let l = -1; l < 2; l++){ let x = (i + k + cols) % cols; let y = (j + l + rows) % rows; sum += grid[x][y]; } } return sum; } s.mouseClicked = function () { if (s.mouseX > s.width || s.mouseX < 0 || s.mouseY > s.height || s.mouseY < 0) return; s.loop(); for (let i = 0; i < grid.length; i++) { for (let j = 0; j < grid[i].length; j++){ let coin = s.random(1); if (coin < rule[4]) { grid[i][j] = 1; } else { grid[i][j] = 0; } } } } })34:T2872,p5(s=>{ // let started = false; // let paused = false; let engine = Matter.Engine.create(); let world = engine.world; class Grid{ constructor(initRowNo, initColNo, w, h){ this.rowNo = initRowNo; this.colNo = initColNo; this.w = w; this.h = h; let cellW = s.floor(this.w/this.rowNo); let cellH = s.floor(this.h/this.colNo); this.cells = []; for (let col = 0; col < this.rowNo; col++) { let r = []; for (let row = 0; row < this.colNo; row++) { let centerX = 10 + (cellW/2 + col * cellW); let centerY = 10 + (cellH/2 + row * cellH); r.push(new Cell(centerX, centerY, cellW, cellH, row, col)); } this.cells.push(r); } } init(){ this.cells.forEach(r => { r.forEach(c=>{ c.init(); }) }) } render(){ this.cells.forEach(r => { r.forEach(c=>{ c.render(); }) }) } } class Cell{ constructor(x,y,w,h,row,col){ this.x = x; this.y = y; this.w = w; this.h = h; this.rowNo = row; this.colNo = col; this.mat = [[0,0,0], [0,0,0], [0,0,0]]; this.lines=[]; } init(){ for (let i = 0;i < 4; i++) { let x = s.random([0,1,2]); let y = s.random([0,1,2]); while(this.mat[x][y] !== 0) { x = s.random([0,1,2]); y = s.random([0,1,2]); } this.mat[x][y] = 1; } let checked = []; let lines = []; for (let x = 0; x < 3; x++) { for (let y =0; y < 3; y ++) { if (this.mat[x][y] === 1) { let has1 = false; // 1 if (this.mat[x-1] !== undefined){ if(this.mat[x-1][y] === 1 && !checked.includes((x-1) + "," + y)){ lines.push(x + "," + y + "-" + (x-1) + "," + (y)); has1 = true; } } if (this.mat[x+1] !== undefined){ if(this.mat[x+1][y] === 1 && !checked.includes((x+1) + "," + y)){ lines.push(x + "," + y + "-" + (x+1) + "," + (y)); has1 = true; } } if (this.mat[x][y-1] !== undefined && this.mat[x][y-1] === 1 && !checked.includes(x + "," + (y-1))) { lines.push(x + "," + y + "-" + (x) + "," + (y-1)); has1 = true; } if (this.mat[x][y+1] !== undefined && this.mat[x][y+1] === 1 && !checked.includes(x + "," + (y+1))) { lines.push(x + "," + y + "-" + (x) + "," + (y+1)); has1 = true; } if (has1) continue; // sqrt2 if (this.mat[x-1] !== undefined){ if(this.mat[x-1][y-1] !== undefined && this.mat[x-1][y-1] === 1 && !checked.includes((x-1) + "," + (y-1))){ let cA = lines.includes(x + "," + y + "-" + (x) + "," + (y-1)) || lines.includes(x + "," + (y-1) + "-" + (x) + "," + (y)); let cB = lines.includes(x + "," + y + "-" + (x-1) + "," + (y)) || lines.includes((x-1) + "," + (y) + "-" + (x) + "," + (y)); if (!cA || !cB) { lines.push(x + "," + y + "-" + (x-1) + "," + (y-1)); } } if(this.mat[x-1][y+1] !== undefined && this.mat[x-1][y+1] === 1 && !checked.includes((x-1) + "," + (y+1))){ let cA = lines.includes(x + "," + y + "-" + (x) + "," + (y+1)) || lines.includes(x + "," + (y+1) + "-" + (x) + "," + (y)); let cB = lines.includes(x + "," + y + "-" + (x-1) + "," + (y)) || lines.includes((x-1) + "," + (y) + "-" + (x) + "," + (y)); if (!cA || !cB) { lines.push(x + "," + y + "-" + (x-1) + "," + (y+1)); } } } if (this.mat[x+1] !== undefined){ if(this.mat[x+1][y-1] !== undefined && this.mat[x+1][y-1] === 1 && !checked.includes((x+1) + "," + (y-1))){ let cA = lines.includes(x + "," + y + "-" + (x) + "," + (y-1)) || lines.includes(x + "," + (y-1) + "-" + (x) + "," + (y)); let cB = lines.includes(x + "," + y + "-" + (x+1) + "," + (y)) || lines.includes((x+1) + "," + (y) + "-" + (x) + "," + (y)); if (!cA || !cB) { lines.push(x + "," + y + "-" + (x+1) + "," + (y-1)); } } if(this.mat[x+1][y+1] !== undefined && this.mat[x+1][y+1] === 1 && !checked.includes((x+1) + "," + (y+1))){ let cA = lines.includes(x + "," + y + "-" + (x) + "," + (y+1)) || lines.includes(x + "," + (y+1) + "-" + (x) + "," + (y)); let cB = lines.includes(x + "," + y + "-" + (x+1) + "," + (y)) || lines.includes((x+1) + "," + (y) + "-" + (x) + "," + (y)); if (!cA || !cB) { lines.push(x + "," + y + "-" + (x+1) + "," + (y+1)); } } } } } } lines.forEach(lstr => { let pstrs = lstr.split('-'); let p1str = pstrs[0].split(','); let p2str = pstrs[1].split(','); let p1 = {x:p1str[0],y:p1str[1]}; let p2 = {x:p2str[0],y:p2str[1]}; let p1A = { x: this.x + (this.w/2 - (p1.x * this.w/2)), y: this.y + (this.h/2 - (p1.y * this.h/2)), }; let p2A = { x: this.x + (this.w/2 - (p2.x * this.w/2)), y: this.y + (this.h/2 - (p2.y * this.h/2)), }; this.lines.push({p1:p1A,p2:p2A}); let d = s.dist(p1A.x,p1A.y,p2A.x,p2A.y); let centerX = (p2A.x + p1A.x)/2; let centerY = (p2A.y + p1A.y)/2; let v = s.createVector(p2A.x - p1A.x, p2A.y- p1A.y); let rigidBody = Matter.Bodies.rectangle(centerX,centerY,d,5, {isStatic: true, restitution: 1, friction: 0, angle: v.heading()}); Matter.World.add(world, rigidBody); }); } render(){ this.lines.forEach(o => { let d = s.dist(o.p1.x,o.p1.y,o.p2.x,o.p2.y); let centerX = (o.p2.x + o.p1.x)/2; let centerY = (o.p2.y + o.p1.y)/2; let v = s.createVector(o.p2.x - o.p1.x, o.p2.y- o.p1.y); s.push(); s.noStroke(); s.fill(50); s.translate(centerX,centerY); s.rotate(v.heading()); s.rect(0,0,d,5); s.pop(); }); } } class Item{ constructor(x,y){ this.rigidBody = undefined; this.c = s.random(70,150); let dice = s.random([0,3,4,5,6,7,8]); this.r = s.random(5,10); if (dice === 0) { this.rigidBody = Matter.Bodies.circle(x,y,this.r,{restitution: 1, friction: 0}); } else { this.rigidBody = Matter.Bodies.polygon(x,y,dice,this.r,{restitution: 1, friction: 0}); } this.sides = dice; Matter.World.add(world, this. rigidBody); this.lastPos = {x:undefined,y:undefined}; } render(){ s.push(); s.strokeWeight(0.8); s.stroke(s.map(this.r, 5, 10, 50, 150)); s.point(this.rigidBody.position.x, this.rigidBody.position.y); if(this.lastPos.x === undefined){ } else { let d = s.dist(this.lastPos.x, this.lastPos.y, this.rigidBody.position.x, this.rigidBody.position.y); s.stroke(s.map(this.r, 5, 10, 25, 50)+s.map(d, 0, 100, 25, 100), 16); s.line(this.lastPos.x, this.lastPos.y, this.rigidBody.position.x, this.rigidBody.position.y); } // s.noStroke(); // s.fill(this.c); // s.translate(this.rigidBody.position.x, this.rigidBody.position.y); // s.rotate(this.rigidBody.angle); // if(this.sides ===0){ // s.ellipse(0,0, 2*this.r); // } else { // polygon(0,0, this.r, this.sides); // } s.pop(); this.lastPos.x = this.rigidBody.position.x; this.lastPos.y = this.rigidBody.position.y; } } let grid; const itemNo = 50; let newWaveTime = 1; let items=[]; let counter = 1; s.setup = function () { s.createCanvas(600,600); s.background(250); s.rectMode(s.CENTER); //s.frameRate(2); grid = new Grid(10,10,s.width-20,s.height-20); grid.init(); //grid.render(); for (let i = 0; i < itemNo; i++) { items.push(new Item(s.random(20,s.width-20), -50)); } s.frameRate(30); } s.draw = function(){ //s.background(250,150); //grid.render(); items.forEach(it => it.render()); Matter.Engine.update(engine); if (newWaveTime < 8){ if (counter % (30 * 15) === 0) { newWave(); newWaveTime ++; } } else { if (counter % (30 * 15) === 0) { s.noLoop(); } } counter ++; } s.mouseClicked = function () { if (!(s.mouseX>0&&s.mouseX0&&s.mouseY\nStop At\n\n\n`\n form.oninput = () => {\n form.value = [form.stopAt.value];\n}\n form.value = [form.stopAt.value];\n \n return form;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":30,"value":"## Mole Kingdom","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":34,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"import {p5c,p5} from \"@real-john-cheung/sm3809-a1\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"require('d3-delaunay')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":36,"value":"Matter = require(\"matter-js@0.17.1\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W35","stdlib":"1","titling":"auto"}} 32:"$31:body"