25:["$","title",null,{"children":"Power diagram | Claudio Esperança | Observable"}] 4b:Tad6,class PowerDiagram { constructor (F) { this.sites = []; this.width = F.length; this.height = F[0].length; this.vertices = []; this.pix = []; for (var x=0; x < this.width; x++) { this.pix[x] = []; for (var y=0; y < this.height; y++) { if (F[x][y] != 0) { let p = Vec(x,y); let S = new Site(p,Math.sqrt(F[x][y])-0.5); this.add(S); } } } this.computeDiagram(); } add (site) { this.sites.push(site); } addItem (p,s,m) { let v = { site: s, visited:false, power: m}; this.pix[p.x][p.y] = v; } setBox (w,h) { this.width = w; this.height = h; this.pix = []; for (var x=0; x < this.width; x++) { this.pix[x] = []; for (var y=0; y < this.height; y++) { let v = { site: -1, visited:false }; this.pix[x][y] = v; } } } power (p,s) { let d = p.dist(s.center); return d*d-s.radius*s.radius; } computeDiagram() { for (var i=0; i < this.width; i++) { for (var j=0; j < this.height; j++) { let minPower = Number.POSITIVE_INFINITY; let minK = 0; let border = false; let borderK = 0; let p = Vec(i,j); let neighbors = 0; for (var k = 0; k < this.sites.length; k++) { let pwr = this.power(p,this.sites[k]); if (pwr < minPower) { minPower = pwr; minK = k; border = false; } } //this.sites[minK].region.add(p); this.addItem(p,minK,minPower); } } } draw(ctx) { if (this.sites.length == 0) return; for (var x=0; x < this.width; x++) { for (var y=0; y < this.height; y++) { ctx.fillStyle = this.sites[this.pix[x][y].site].color; ctx.fillRect(x, y, 1, 1); } } for (var i=0; i < this.sites.length; i++) { this.sites[i].draw(ctx); } for (var i=0; i < this.vertices.length; i++) { if (this.vertices[i].connect.length == 3) { ctx.strokeStyle= "black"; } else { ctx.strokeStyle= "white"; } ctx.beginPath() ctx.arc(this.vertices[i].center.x, this.vertices[i].center.y, 10, 0, Math.PI*2) ctx.fill() ctx.stroke(); } } }4c:[] 47:{"id":"66fe094aaf1c38b3","slug":"power-diagram","title":"Power diagram","thumbnail":"d7dd08017dca865d977a269e39a7e4fd55283a16c00b6c02344f70a4f45c8b68","access_level":"public","create_time":"$D2019-06-12T12:53:21.880Z","update_time":"$D2019-06-12T14:32:11.349Z","view_time":null,"first_public_time":"$D2019-06-12T13:39:21.974Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"e9fcee55f21948e0","login":"esperanc","name":"Claudio Esperança","avatar_url":"https://avatars-next.observableusercontent.com/91db65fe4bf8e490e5ff1a548612f36ccc04fa7781189e7e4dc7ba6633a66e52","tier":"starter_2024","bio":"Computer Graphics & Visualization @ufrj.br ","followed_by_you":false,"follows_you":false},"version":120,"publish_version":120,"role":null,"authored":false,"authors":[{"type":"individual","id":"591dcad3c6121253","login":"esperanc","name":"Claudio Esperança","avatar_url":"https://avatars-next.observableusercontent.com/91db65fe4bf8e490e5ff1a548612f36ccc04fa7781189e7e4dc7ba6633a66e52","tier":null,"bio":"Computer Graphics & Visualization @ufrj.br ","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"591dcad3c6121253","login":"esperanc","name":"Claudio Esperança","avatar_url":"https://avatars-next.observableusercontent.com/91db65fe4bf8e490e5ff1a548612f36ccc04fa7781189e7e4dc7ba6633a66e52","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Power diagram","cells":[{"id":0,"value":"md`# Power diagram`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":87,"value":"{\n let div = html``;\n div.append(showDiagram());\n div.append(showInterface);\n return div\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":95,"value":"md`The function **showDiagram** draws the power diagram for *mymatrix*`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"showDiagram = function() {\n let canvas = html`