2b:null 2c:["$","title",null,{"children":"Federated learning diagram | Grant Custer | Observable"}] 31:Tba8,svg = html``32:[] 2f:{"id":"0145bf176ee7ecba","slug":"federated-learning-diagram","title":"Federated learning diagram","thumbnail":"913e2e2d0bc5d1cc9869819381647e2a226ae2e2a4ede02ad5b4502ce06db55f","access_level":"public","create_time":"$D2018-10-26T15:42:38.296Z","update_time":"$D2018-10-30T14:39:44.566Z","view_time":null,"first_public_time":"$D2018-10-26T21:50:48.037Z","fork":false,"stars":2,"starred":false,"owner":{"type":"team","id":"bf2c1edd2a33aa1b","login":"grantcuster","name":"Grant Custer","avatar_url":"https://avatars-next.observableusercontent.com/10eebb9a620b6b833738fb495f94fb682bcdc3270b247a9a8aef575ed0702c48","tier":"starter_2024"},"version":385,"publish_version":385,"role":null,"authored":false,"authors":[{"type":"individual","id":"a1f8c368ee3d80be","login":"grantcuster","name":"Grant Custer","avatar_url":"https://avatars-next.observableusercontent.com/10eebb9a620b6b833738fb495f94fb682bcdc3270b247a9a8aef575ed0702c48","tier":null}],"members":[{"type":"individual","id":"a1f8c368ee3d80be","login":"grantcuster","name":"Grant Custer","avatar_url":"https://avatars-next.observableusercontent.com/10eebb9a620b6b833738fb495f94fb682bcdc3270b247a9a8aef575ed0702c48","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":2,"collection":null,"type":"notebook","body":{"title":"Federated learning diagram","cells":[{"id":0,"value":"md`# Federated learning diagram`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":253,"value":"md`Nodes (green boxes) do linear regression (black line) on the data (white dots). Those lines are averaged together for the federated model (black line) on the server (orange box).`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":222,"value":"viewof regen = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":245,"value":"DOM.download(serialize(svg), null, \"Download as SVG\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":247,"value":"DOM.download(await rasterize(svg), null, \"Download as PNG\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":109,"value":"dots = {\n regen;\n let dots = [...Array(node_number)].map((n, i) =>\n [\n ...Array(data_dot_number + Math.floor(Math.random() * data_dot_number))\n ].map((nd, i) => {\n let random_x = Math.random();\n let line_y = dot_y_space - random_x * dot_y_space;\n let jitter_y;\n if (Math.random() > 0.5) {\n jitter_y = (dot_y_space - line_y) * Math.random() + line_y;\n } else {\n jitter_y = line_y * Math.random();\n }\n return [random_x * dot_x_space, jitter_y];\n })\n );\n return dots;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":76,"value":"function getNodeX(i) {\n return node_outside_padding + node_padding * i + node_width * i;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":125,"value":"regressions = dots.map((ds, di) => {\n return ss.linearRegression(ds);\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":130,"value":"node_lines = regressions.map((l, i) => {\n let first = [0, 0 * l.m + l.b];\n let second = [dot_x_space, dot_x_space * l.m + l.b];\n return [first, second];\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":175,"value":"server_line_ys = {\n let total_dots = dots.reduce((total, ds) => {\n return total + ds.length;\n }, 0);\n let line_totals = node_lines.reduce(\n (total, line, i) => {\n let weight = dots[i].length;\n let y1 = line[0][1];\n let y2 = line[1][1];\n let new_total = [total[0] + y1 * weight, total[1] + y2 * weight];\n return new_total;\n },\n [0, 0]\n );\n return [\n line_totals[0] / total_dots / dot_y_space,\n line_totals[1] / total_dots / dot_y_space\n ];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"node_outside_padding = node_padding * 2","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"node_padding = 20","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":27,"value":"node_width =\n (maxed_width - node_outside_padding * 2 - node_padding * (node_number - 1)) /\n node_number","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"node_number = 4","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":36,"value":"node_aspect = 4 / 3","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":38,"value":"node_height = node_width / node_aspect","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":74,"value":"node_y_offset = 30","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":88,"value":"function getNodeY(i) {\n if (i === 0 || i === node_number - 1) {\n return height - node_height - node_outside_padding - node_y_offset;\n } else {\n return height - node_height - node_outside_padding;\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":51,"value":"server_width = node_width * 1.25","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":60,"value":"server_x = (maxed_width - server_width) / 2","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":207,"value":"server_y = node_outside_padding","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":53,"value":"server_height = server_width / node_aspect","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"data_dot_number = 12","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"maxed_width = Math.min(width, 600)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"height = maxed_width / aspect_ratio","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":46,"value":"green_fill = \"#35c4a6\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":56,"value":"orange_fill = \"#F68943\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"aspect_ratio = 1.5","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":105,"value":"dot_padding = 20","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":112,"value":"dot_x_space = node_width - dot_padding * 2","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":114,"value":"dot_y_space = node_height - dot_padding * 2","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":123,"value":"ss = require(\"simple-statistics\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":249,"value":"import {serialize, rasterize} from \"@mbostock/saving-svg\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"1","titling":"auto"}} 30:"$2f:body"