2d:null 2e:["$","title",null,{"children":"Presentation Sildes And Materials | John C | Observable"}] 33:T73b,p5(s => { let lno = lineNo; const c = 0.1; const pl = 600; class Ring { constructor(x, y, sz){ this.x = x; this.y = y; this.speed = 0; this.sz = sz; } render(){ s.noFill(); s.stroke(0); s.strokeWeight(0.5); s.ellipse(this.x, this.y, this.sz/3, this.sz); } update(){ this.speed += s.random(-1, 1) * c; this.speed = s.constrain(this.speed, -1.2, 1.2); if (this.x + this.speed < 0 || this.x + this.speed > pl) { this.speed = - this.speed; } this.x += this.speed; } } class Pole { constructor(y) { this.y = y; this.ringsz = 4; this.ringarr = []; for (let i = 0; i < 30; i++) { this.ringarr.push(new Ring(s.random(10, pl - 10), this.y, this.ringsz)); } } updateRings(){ this.ringarr.forEach(r => r.update()); } collisionCheck(){ for (let i = 0; i < this.ringarr.length; i++){ for (let j = 0; j < this.ringarr.length; j++) { if (i === j) continue; if (s.abs(this.ringarr[i].x - this.ringarr[j].x) < this.ringsz/3) { let ispeedbc = this.ringarr[i].speed; this.ringarr[i].speed = this.ringarr[j].speed; this.ringarr[j].speed = ispeedbc; } } } } render() { s.push(); s.stroke(50); s.strokeWeight(0.5); s.line(0, this.y, pl, this.y); s.pop(); this.ringarr.forEach(r => r.render()); } } let poles = [] s.setup = function() { s.createCanvas(600, 10 * lno); for (let i = 0; i < lno; i ++){ poles.push(new Pole(5+i*10)); } } s.draw = function() { s.background(255); poles.forEach(p => { p.render(); p.updateRings(); p.collisionCheck(); }) } })34:Te06, p5 (s => { let rcno = rno; class PolarizationFilter { constructor(x, y, r, d, sp){ this.x = x; this.y = y; this.radius = r; this.direction = d; // in degree, 0 - 360; this.speed = sp; } rotate() { this.direction += this.speed; this.direction = this.direction % 360; } render() { s.push(); s.noFill(); s.stroke(100, 30); s.translate(this.x, this.y); s.rotate(this.direction); s.line(-this.radius,0,this.radius,0); s.ellipse(0,0,2*this.radius); s.pop(); } renderShadow(){ s.push(); s.noStroke(); s.fill(230); s.translate(this.x, this.y); s.ellipse(0,0,2*this.radius); s.pop() } } let pfs = []; let pxarr = []; let d; const newSet = function(x, y, c) { let d = s.pixelDensity(); let index = 0; for (let i = 0; i < d; i++) { for (let j = 0; j < d; j++) { // loop over index = 4 * ((y * d + j) * s.width * d + (x * d + i)); s.pixels[index] = c; s.pixels[index+1] = c; s.pixels[index+2] = c; s.pixels[index+3] = 255; } } } s.setup = function() { s.createCanvas(600, 600); s.angleMode(s.DEGREES); d = s.width/(0.75 * rno + 1); for (let i = 0 ; i < rno; i ++) { for (let j = 0; j < rno; j ++) { let cx = 20 + d/2 + 0.75 * d * i; let cy = 20 + d/2 + 0.75 * d * j; pfs.push(new PolarizationFilter(cx,cy,parseInt(d/2),parseInt(s.random(360)), parseInt(s.random(10, 30)))); } } for (let x = 0; x < s.width; x++) { let col = []; for (let y = 0; y < s.height; y++) { col[y] = 255; } pxarr.push(col); } s.background(255); pfs.forEach(pf => { pf.renderShadow(); for (let x = s.floor(pf.x - pf.radius); x < s.ceil(pf.x + pf.radius); x++){ for (let y = s.floor(pf.y - pf.radius); y < s.ceil(pf.y + pf.radius); y++){ if (x > -1 && y > -1 && s.dist(x, y, pf.x, pf.y) < pf.radius) { pxarr[x][y] = 230; } } } }) } s.draw = function() { //update status pfs.forEach((pf,i) => { // down if (i + 1 < pfs.length) { let pfd = pfs[i + 1]; for (let x = s.floor(pf.x - pf.radius); x < s.ceil(pf.x + pf.radius); x++){ for (let y = s.floor(pf.y + pf.radius/2); y < s.ceil(pf.y + pf.radius); y++){ if (x > -1 && y > -1 && s.dist(x, y, pf.x, pf.y) < pf.radius && s.dist(x,y,pfd.x,pfd.y) < pfd.radius) { pxarr[x][y] = 230*s.sq(s.cos(pf.direction-pfd.direction)); } } } } //right if (i + rcno < pfs.length){ let pfr = pfs[i + rcno]; for (let x = s.floor(pf.x + pf.radius/2); x < s.ceil(pf.x + pf.radius); x++){ for (let y = s.floor(pf.y - pf.radius); y < s.ceil(pf.y + pf.radius); y++){ if (x > -1 && y > -1 && s.dist(x, y, pf.x, pf.y) < pf.radius && s.dist(x,y,pfr.x,pfr.y) < pfr.radius) { pxarr[x][y] = 230*s.sq(s.cos(pf.direction-pfr.direction)); } } } } }); // s.loadPixels(); for (let x = 0; x < s.width; x++) { for (let y = 0; y < s.height; y++) { if (pxarr[x][y] < 230){ newSet(x, y, pxarr[x][y]); }; } } s.updatePixels(); pfs.forEach(pf => { pf.rotate(); //pf.render(); }); } })35:[{"id":"e3b3d63b49793e6bafcf98de5ca92e905616842c42a7082e0935e2c33421284d3a3e88db4c931d0bc8c96fe6235e52af517a4c2af6b4a4f4ffd1f8d895494c28","href":"https://static.observableusercontent.com/files/e3b3d63b49793e6bafcf98de5ca92e905616842c42a7082e0935e2c33421284d3a3e88db4c931d0bc8c96fe6235e52af517a4c2af6b4a4f4ffd1f8d895494c28","name":"pe_lang.pdf","type":"application/pdf","lastModified":1631359400586.152,"size":22683432},{"id":"0de1b4a3d3935c81b4d28e50516fc86ff1793f62c75c4ed38707b298c69f545bd60630c4e4ccb4193947d3d89582d9a4956ee259d33af19dc1bc0e66adec72c9","href":"https://static.observableusercontent.com/files/0de1b4a3d3935c81b4d28e50516fc86ff1793f62c75c4ed38707b298c69f545bd60630c4e4ccb4193947d3d89582d9a4956ee259d33af19dc1bc0e66adec72c9","name":"polarizationSimulation.mp4","type":"video/mp4","lastModified":1631359439074.317,"size":19819856},{"id":"1c2d747059f69c97e5c29efdc9e463235e09d4e0122167484162cf876a9394a3b03db6417125f1fc075e2de057626ca6123021c66efe9bf651e0e0b195ccd578","href":"https://static.observableusercontent.com/files/1c2d747059f69c97e5c29efdc9e463235e09d4e0122167484162cf876a9394a3b03db6417125f1fc075e2de057626ca6123021c66efe9bf651e0e0b195ccd578","name":"polarizationSimulation.gif","type":"image/gif","lastModified":1631359551059.422,"size":14375244},{"id":"bf870d8ae5e7b297a3d89b78d8f2096b6ffe8d2531966584a61dadc9847cec0a01be6fc0b273c4602cfc52ae8f3f49c3de17a5150abe7a131f4e7f6a3ee0e278","href":"https://static.observableusercontent.com/files/bf870d8ae5e7b297a3d89b78d8f2096b6ffe8d2531966584a61dadc9847cec0a01be6fc0b273c4602cfc52ae8f3f49c3de17a5150abe7a131f4e7f6a3ee0e278","name":"pe_lang@1.pdf","type":"application/pdf","lastModified":1631679498792.209,"size":26183966}] 31:{"id":"1747b63a6338ce87","slug":"2220-pre","title":"Presentation Sildes And Materials","thumbnail":"396a23a5ca8f2e92b0687fcb172011a05c2799c102c62a72f80acdd2bfe14d97","access_level":"public","create_time":"$D2021-09-11T06:49:49.262Z","update_time":"$D2021-09-15T04:20:34.786Z","view_time":null,"first_public_time":"$D2021-09-11T11:27:45.837Z","has_unpublished_edits":null,"fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"b2e9840be7b1b607","login":"real-john-cheung","name":"John C","avatar_url":"https://avatars-next.observableusercontent.com/1d9ef6121a0bbd1a75fab479f9891fe1d78cc65f76c394585ae1a7dad0d3abf6","tier":"starter_2024"},"version":212,"publish_version":212,"role":null,"authored":false,"authors":[{"type":"individual","id":"e8e99acdbe3aebfb","login":"real-john-cheung","name":"John C","avatar_url":"https://avatars-next.observableusercontent.com/1d9ef6121a0bbd1a75fab479f9891fe1d78cc65f76c394585ae1a7dad0d3abf6","tier":null}],"members":[{"type":"individual","id":"e8e99acdbe3aebfb","login":"real-john-cheung","name":"John C","avatar_url":"https://avatars-next.observableusercontent.com/1d9ef6121a0bbd1a75fab479f9891fe1d78cc65f76c394585ae1a7dad0d3abf6","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"Presentation Sildes And Materials","cells":[{"id":3,"value":"html`

Presentation Sildes And Materials

Slides

Digital Moving Objects

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"viewof lineNo = Inputs.range([1,50],{value:20, step:1, label: \"No. of Poles\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":32,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":54,"value":"html`

Digital Polarization

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":152,"value":"html`

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":188,"value":"

Below is an implementation in js, please note that increasing # of filters might slow down the browser.

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":174,"value":"viewof rno = Inputs.range([0,10],{value:0, step:1, label: \"No. of rows/columns\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":171,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":208,"value":"html`

Something more about randomness

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"html`

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"html`\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":29,"value":"import {p5} from \"@real-john-cheung/sm3809-a1\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W35","stdlib":"1","titling":"auto"}} 32:"$31:body"