2f:T71d,function make_brackets() { let div = d3 .create('div') .style('width', div_width + 'px') .style('height', div_height + 'px') .style('position', 'relative'); let svg = div .append('svg') .attr('width', div_width) .attr('height', div_height) .style('width', div_width + 'px') .style('height', div_height + 'px') .style('position', 'absolute'); svg .selectAll('path.link') .data(tourney_tree.links()) .join('path') .attr('class', function(d) { let label = 'link'; if ( d.target.data.WTeam.TeamID == d.source.data.WTeam.TeamID || d.target.data.WTeam.TeamID == d.source.data.LTeam.TeamID ) { label = label + ' Team' + d.target.data.WTeam.TeamID; } return label; }) .attr('stroke', 'black') .attr('stroke-width', 1) .attr('fill', 'none') .attr('d', connector); div .selectAll('div.game') .data(tourney_tree.descendants()) .enter() .append(d => game_container(d)); div .selectAll('.team') .on('mouseenter', function() { let class_label = d3 .select(this) .attr('class') .split(' ')[2]; div .selectAll('.team.' + class_label) .style('background-color', '#99ee99'); div.selectAll('.game.' + class_label).style('border', 'solid 3px black'); svg.selectAll('.link.' + class_label).attr('stroke-width', 3); }) .on('mouseleave', function() { let class_label = d3 .select(this) .attr('class') .split(' ')[2]; div.selectAll('.team.' + class_label).style('background-color', null); div.selectAll('.game.' + class_label).style('border', 'solid 1px black'); svg.selectAll('.link.' + class_label).attr('stroke-width', 1); }); return div.node(); }30:T631,function connector(link) { if (link.target.data.round >= 2) { let x1 = link.source.x2; let y1 = link.source.y2; let x2 = link.target.x2; let y2 = link.target.y2; let xx1, yy1, xx2, yy2; let path; let [seed1, seed2] = link.target.data.expected_seeds; if (seed1 < seed2) { // upper if (link.target.data.region == 'W' || link.target.data.region == 'Y') { xx1 = x1 + team_width / 2; yy1 = y1; xx2 = x2 + team_width; yy2 = y2 + game_height / 2; path = [[xx1, yy1], [xx1, yy2], [xx2, yy2]]; return d3.line()(path); } else if ( link.target.data.region == 'X' || link.target.data.region == 'Z' ) { xx1 = x1 + team_width / 2; yy1 = y1; xx2 = x2; yy2 = y2 + game_height / 2; path = [[xx1, yy1], [xx1, yy2], [xx2, yy2]]; return d3.line()(path); } } else { if (link.target.data.region == 'W' || link.target.data.region == 'Y') { xx1 = x1 + team_width / 2; yy1 = y1 + game_height; xx2 = x2 + team_width; yy2 = y2 + game_height / 2; path = [[xx1, yy1], [xx1, yy2], [xx2, yy2]]; return d3.line()(path); } else if ( link.target.data.region == 'X' || link.target.data.region == 'Z' ) { xx1 = x1 + team_width / 2; yy1 = y1 + game_height; xx2 = x2; yy2 = y2 + game_height / 2; path = [[xx1, yy1], [xx1, yy2], [xx2, yy2]]; return d3.line()(path); } } } else { return null; } }31:T703,function horizontal_rescaler(d) { let region = d.data.region; let scaler; let s = 3; if (region == 'X' || region == 'WX') { if (d.data.round == 2) { scaler = d3 .scaleLinear() .domain([0, div_width]) .range([ 0.5 * div_width - 1.5 * team_width - s, div_width - team_width - s ]); } else { scaler = d3 .scaleLinear() .domain([0, div_width]) .range([0.5 * div_width - 1.5 * team_width, div_width - team_width]); } } else if (region == 'W') { if (d.data.round == 2) { scaler = d3 .scaleLinear() .domain([0, div_width]) .range([0.5 * (div_width + team_width) + s, s]); } else { scaler = d3 .scaleLinear() .domain([0, div_width]) .range([0.5 * (div_width + team_width), 0]); } } else if (region == 'Y' || region == 'YZ') { if (d.data.round == 2) { scaler = d3 .scaleLinear() .domain([0, div_width]) .range([0.5 * (div_width + team_width) + s, s]); } else { scaler = d3 .scaleLinear() .domain([0, div_width]) .range([0.5 * (div_width + team_width), 0]); } } else if (region == 'Z') { if (d.data.round == 2) { scaler = d3 .scaleLinear() .domain([0, div_width]) .range([ 0.5 * div_width - 1.5 * team_width - s, div_width - team_width - s ]); } else { scaler = d3 .scaleLinear() .domain([0, div_width]) .range([0.5 * div_width - 1.5 * team_width, div_width - team_width]); } } else if (region == 'CH') scaler = d3 .scaleLinear() .domain([0, div_width]) .range([0.5 * (div_width - team_width), 0]); return scaler(d.y); }32:T42d,function vertical_rescaler(d) { let region = d.data.region; if (region == 'W') { let scaler = d3 .scaleLinear() .domain([-0.25 * div_height, 0.25 * div_height]) .range([div_height - game_height / 2, -game_height / 2]); return scaler(d.x); } else if (region == 'X') { let scaler = d3 .scaleLinear() .domain([0, 0.5 * div_height]) .range([div_height - game_height / 2, -game_height / 2]); return scaler(d.x); } else if (region == 'Y') { let scaler = d3 .scaleLinear() .domain([div_height * 0.5, div_height]) .range([div_height - game_height / 2, -game_height / 2]); return scaler(d.x); } else if (region == 'Z') { let scaler = d3 .scaleLinear() .domain([div_height * 0.75, 1.25 * div_height]) .range([div_height - game_height / 2, -game_height / 2]); return scaler(d.x); } else if (region == 'WX') { return 0.4 * div_height; } else if (region == 'YZ') { return 0.6 * div_height; } else if (region == 'CH') { return 0.5 * div_height; } }33:T440,function game_container(game) { let top_team, bot_team; if (game.data.WTeam.pos == 'top') { top_team = game.data.WTeam; bot_team = game.data.LTeam; } else { top_team = game.data.LTeam; bot_team = game.data.WTeam; } let div = d3 .create('div') .attr('class', function(d) { let label = 'game '; label = label + 'Team' + top_team.TeamID + ' '; label = label + 'Team' + bot_team.TeamID; return label; }) .style('width', team_width + 'px') .style('height', game_height + 'px') .style('left', game.x2 + 'px') .style('top', game.y2 + 'px') .style('border', 'solid 0.5px black') .style('position', 'absolute'); if (game.data.WTeam.seed - game.data.LTeam.seed > 4) { div.append(() => team_container(top_team, game.data.round, 'upset')); div.append(() => team_container(bot_team, game.data.round, 'upset')); } else { div.append(() => team_container(top_team, game.data.round, 'top_team')); div.append(() => team_container(bot_team, game.data.round, 'bot_team')); } return div.node(); }34:Taa0,tourney = { let tourney = { region: 'CH', round: 6, expected_seeds: [1, 1], children: [ { region: 'WX', round: 5, expected_seeds: [1, 1], children: [ { region: 'W', round: 4, expected_seeds: [1, 2] }, { region: 'X', round: 4, expected_seeds: [1, 2] } ] }, { region: 'YZ', round: 5, expected_seeds: [1, 1], children: [ { region: 'Y', round: 4, expected_seeds: [1, 2] }, { region: 'Z', round: 4, expected_seeds: [1, 2] } ] } ] }; let stack = [ tourney.children[0].children[0], tourney.children[0].children[1], tourney.children[1].children[0], tourney.children[1].children[1] ]; while (stack.length > 0) { let node = stack.pop(); let high_seed = node.expected_seeds[0]; let new_low_seed = 2 ** (5 - node.round + 1) - high_seed + 1; let child0 = { region: node.region, expected_seeds: [high_seed, new_low_seed], round: node.round - 1 }; let low_seed = node.expected_seeds[1]; let lower_seed = 2 ** (5 - node.round + 1) - low_seed + 1; let child1 = { region: node.region, expected_seeds: [lower_seed, low_seed], round: node.round - 1 }; node.children = [child0, child1]; if (node.round > 2) { stack.push(child0); stack.push(child1); } else { Object.assign(child0, round1_info(child0)); Object.assign(child1, round1_info(child1)); } } stack = [tourney]; let cnt = 0; while (stack.length > 0 && cnt++ < 100) { let node = stack.pop(); let [child0, child1] = node.children; let team0, team1; if (child0.WTeam) { team0 = Object.assign({}, child0.WTeam); team1 = Object.assign({}, child1.WTeam); let scores = get_scores(team0.TeamID, team1.TeamID); team0.score = scores[0]; team1.score = scores[1]; let wTeam, lTeam; if (team0.score > team1.score) { wTeam = team0; lTeam = team1; } else { wTeam = team1; lTeam = team0; } if (display_map.get(wTeam.seed) < display_map.get(lTeam.seed)) { wTeam.pos = 'top'; lTeam.pos = 'bot'; } else { wTeam.pos = 'bot'; lTeam.pos = 'top'; } node.WTeam = wTeam; node.LTeam = lTeam; } else { stack.push(node); if (node.round > 2) { stack.push(child0); stack.push(child1); } } } return tourney; }35:T690,function get_team(region, expected_seed) { let slot, teamID, teamName; let playin = false; if (expected_seed < 10) { slot = region + '0' + expected_seed.toString(); } else { slot = region + expected_seed.toString(); } let seed = this_years_seeds.map(d => d.Seed).indexOf(slot); if (seed > -1) { teamID = this_years_seeds[seed].TeamID; teamName = team_map.get(teamID); } else { let seeda = this_years_seeds.map(d => d.Seed).indexOf(slot + 'a'); let seedb = this_years_seeds.map(d => d.Seed).indexOf(slot + 'b'); if (seeda > -1) { let playin_opponentID, playin_opponent_name, playin_opponent_score, score; let teamIDa = this_years_seeds[seeda].TeamID; let teamNamea = team_map.get(teamIDa); let teamIDb = this_years_seeds[seedb].TeamID; let teamNameb = team_map.get(teamIDb); let scores = get_scores(teamIDa, teamIDb); if (scores[0] < scores[1]) { teamName = teamNameb; teamID = teamIDb; score = scores[1]; playin_opponentID = teamIDa; playin_opponent_name = teamNamea; playin_opponent_score = scores[0]; } else { teamName = teamNamea; teamID = teamIDa; score = scores[0]; playin_opponentID = teamIDb; playin_opponent_name = teamNameb; playin_opponent_score = scores[1]; } playin = { score: score, playin_opponentID: playin_opponentID, playin_opponent_name: playin_opponent_name, playin_opponent_score: playin_opponent_score }; } } return { TeamName: teamName, TeamID: teamID, seed: expected_seed, playin: playin }; }36:[{"id":"5c657627331cc523e6c6e322a20a54e9ed61d92d7c387d68506063cfc073c4b85cf742d9f71a26eca065f4ddedc34c26e5c0fdfa6a965e45971048767253c393","href":"https://static.observableusercontent.com/files/5c657627331cc523e6c6e322a20a54e9ed61d92d7c387d68506063cfc073c4b85cf742d9f71a26eca065f4ddedc34c26e5c0fdfa6a965e45971048767253c393","name":"WNCAATourneySeeds.csv","type":"text/csv","lastModified":1582977064626.271,"size":21140},{"id":"4660fcb66cc83eb54ecd539a51ca479bda26b8eb8600fd5d1947af79730347c8b961fca32ad46561e1cb796c5149675444c23e5a62c2ba6d4f948db337598a33","href":"https://static.observableusercontent.com/files/4660fcb66cc83eb54ecd539a51ca479bda26b8eb8600fd5d1947af79730347c8b961fca32ad46561e1cb796c5149675444c23e5a62c2ba6d4f948db337598a33","name":"WNCAATourneyCompactResults.csv","type":"text/csv","lastModified":1582977064626.271,"size":41667},{"id":"2343c34f71a68388b057661e45b8c52a60cd9ba1ea937ed01cdc62012d1549bce584e779f4cad676f990896b76cde74be2b379526eb37f6865ed50f2b9958fc0","href":"https://static.observableusercontent.com/files/2343c34f71a68388b057661e45b8c52a60cd9ba1ea937ed01cdc62012d1549bce584e779f4cad676f990896b76cde74be2b379526eb37f6865ed50f2b9958fc0","name":"WTeams.csv","type":"text/csv","lastModified":1582977064626.271,"size":5955},{"id":"3a201b34bbb660b5f9d2cebb59e2375710b6ba4cd3af9c621273809fa9ac258c916540505585a31cbaa87c644656c2778bf5ad0039974f15ca0e5d24a8c10007","href":"https://static.observableusercontent.com/files/3a201b34bbb660b5f9d2cebb59e2375710b6ba4cd3af9c621273809fa9ac258c916540505585a31cbaa87c644656c2778bf5ad0039974f15ca0e5d24a8c10007","name":"MTeams.csv","type":"text/csv","lastModified":1582977064626.271,"size":9676},{"id":"0f6f995791929442a5a324d6d88d6864f06865d7e0f99c9da042f96f7c5ec52e724c9168eab1fffa3e25f65f3e6b2c082c92fbbda40c55983e03565861112e68","href":"https://static.observableusercontent.com/files/0f6f995791929442a5a324d6d88d6864f06865d7e0f99c9da042f96f7c5ec52e724c9168eab1fffa3e25f65f3e6b2c082c92fbbda40c55983e03565861112e68","name":"MNCAATourneySeeds.csv","type":"text/csv","lastModified":1582977064626.271,"size":34402},{"id":"81aa481933c2c3542b1dcf4c08037ab024cda4f75764a3f9c7f6f1950aeb09e5ba61c3368aca0c3e02d48f5eb0da8fbabc8d6bf7656e08a61c6c70a9fad22c04","href":"https://static.observableusercontent.com/files/81aa481933c2c3542b1dcf4c08037ab024cda4f75764a3f9c7f6f1950aeb09e5ba61c3368aca0c3e02d48f5eb0da8fbabc8d6bf7656e08a61c6c70a9fad22c04","name":"MNCAATourneyCompactResults.csv","type":"text/csv","lastModified":1582977064626.271,"size":67684}] 2d:{"title":"NCAA Brackets - innerHeight","cells":[{"id":0,"value":"md`# NCAA Brackets - \\`innerHeight\\``","pinned":false,"hidden":false,"mode":"ojs"},{"id":678,"value":"viewof men_or_women = radio({ options: [\"Men\", \"Women\"], value: \"Men\" })","pinned":false,"hidden":false,"mode":"ojs"},{"id":684,"value":"viewof year = {\n let years;\n if (men_or_women == \"Men\") {\n years = d3.range(1985, 2020).reverse();\n } else {\n years = d3.range(1998, 2020).reverse();\n }\n return select({ title: \"Year\", options: years });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1548,"value":"brackets = make_brackets()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1551,"value":"md`## Code`","pinned":false,"hidden":false,"mode":"ojs"},{"id":926,"value":"$2f","pinned":true,"hidden":false,"mode":"ojs"},{"id":1345,"value":"$30","pinned":true,"hidden":false,"mode":"ojs"},{"id":1197,"value":"$31","pinned":true,"hidden":false,"mode":"ojs"},{"id":1194,"value":"$32","pinned":true,"hidden":false,"mode":"ojs"},{"id":938,"value":"$33","pinned":true,"hidden":false,"mode":"ojs"},{"id":1225,"value":"function team_container(team, round, tb) {\n let div = d3.create('div').attr('class', function(d) {\n let label = 'team ' + tb + ' ';\n label = label + 'Team' + team.TeamID;\n return label;\n });\n if (round == 1) {\n let seed_span = div.append('span').text(team.seed + ' ');\n if (team.playin) {\n seed_span.style('color', 'blue');\n let title = 'Play-in info
';\n title = title + `${team.TeamName}: ${team.playin.score}
`;\n title =\n title +\n `${team.playin.playin_opponent_name}: ${team.playin.playin_opponent_score}`;\n seed_span.attr('title', title);\n tippy(seed_span.node());\n }\n }\n div.append('span').text(team.TeamName);\n div\n .append('span')\n .attr('class', 'score')\n .text(team.score);\n\n return div.node();\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1339,"value":"tourney_tree = {\n let tree = d3.hierarchy(tourney);\n tree.sort(function(x, y) {\n return (\n display_map.get(y.data.expected_seeds[0]) -\n display_map.get(x.data.expected_seeds[0])\n );\n });\n d3\n .tree()\n .separation((a, b) => (a.parent == b.parent ? 1 : 1.1) / a.depth)\n .size([div_height, div_width])(tree);\n\n tree.descendants().forEach(function(v) {\n v.x2 = horizontal_rescaler(v);\n v.y2 = vertical_rescaler(v);\n });\n\n return tree;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":6,"value":"$34","pinned":true,"hidden":false,"mode":"ojs"},{"id":458,"value":"display_map = {\n let display_order = [1, 16, 9, 8, 5, 12, 13, 4, 3, 14, 11, 6, 7, 10, 15, 2];\n let display_map = new Map();\n display_order.forEach((d, i) => display_map.set(d, i + 1));\n return display_map;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":904,"value":"$35","pinned":true,"hidden":false,"mode":"ojs"},{"id":482,"value":"function round1_info(o) {\n let team0 = get_team(o.region, o.expected_seeds[0]);\n let team1 = get_team(o.region, o.expected_seeds[1]);\n let scores = get_scores(team0.TeamID, team1.TeamID);\n team0.score = scores[0];\n team1.score = scores[1];\n\n let wTeam, lTeam;\n if (team0.score > team1.score) {\n wTeam = team0;\n lTeam = team1;\n } else {\n wTeam = team1;\n lTeam = team0;\n }\n if (display_map.get(wTeam.seed) < display_map.get(lTeam.seed)) {\n wTeam.pos = 'top';\n lTeam.pos = 'bot';\n } else {\n wTeam.pos = 'bot';\n lTeam.pos = 'top';\n }\n return { WTeam: wTeam, LTeam: lTeam };\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":505,"value":"function get_scores(teamID1, teamID2) {\n let result = this_years_mresults.filter(function(o) {\n return (\n (o.WTeamID == teamID1 && o.LTeamID == teamID2) ||\n (o.WTeamID == teamID2 && o.LTeamID == teamID1)\n );\n });\n if (result.length == 1) {\n result = result[0];\n if (result.WTeamID == teamID1) {\n return [result.WScore, result.LScore].map(d => parseInt(d));\n } else if (result.LTeamID == teamID1) {\n return [result.LScore, result.WScore].map(d => parseInt(d));\n }\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":503,"value":"this_years_mresults = {\n if (men_or_women == \"Men\") {\n return mresults.filter(d => d.Season == year);\n } else {\n return wresults.filter(d => d.Season == year);\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":477,"value":"this_years_seeds = {\n if (men_or_women == \"Men\") {\n return mseeds.filter(d => d.Season == year);\n } else {\n return wseeds.filter(d => d.Season == year);\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":695,"value":"wseeds = d3.csvParse(await FileAttachment(\"WNCAATourneySeeds.csv\").text())","pinned":true,"hidden":false,"mode":"ojs"},{"id":693,"value":"wresults = d3.csvParse(\n await FileAttachment(\"WNCAATourneyCompactResults.csv\").text()\n)","pinned":true,"hidden":false,"mode":"ojs"},{"id":706,"value":"team_map = {\n if (men_or_women == \"Men\") {\n return mteam_map;\n } else {\n return wteam_map;\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":701,"value":"wteam_map = {\n let wteams = d3.csvParse(await FileAttachment(\"WTeams.csv\").text());\n let wteam_map = new Map();\n wteams.forEach(function(team) {\n wteam_map.set(team.TeamID, team.TeamName);\n });\n return wteam_map;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":259,"value":"mteam_map = {\n let mteams = d3.csvParse(await FileAttachment(\"MTeams.csv\").text());\n let mteam_map = new Map();\n mteams.forEach(function(team) {\n mteam_map.set(team.TeamID, team.TeamName);\n });\n return mteam_map;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":253,"value":"mseeds = d3.csvParse(await FileAttachment(\"MNCAATourneySeeds.csv\").text())","pinned":true,"hidden":false,"mode":"ojs"},{"id":277,"value":"mresults = d3.csvParse(\n await FileAttachment(\"MNCAATourneyCompactResults.csv\").text()\n)","pinned":true,"hidden":false,"mode":"ojs"},{"id":2,"value":"d3 = require('d3@5')","pinned":true,"hidden":false,"mode":"ojs"},{"id":632,"value":"import { select, radio } from \"@jashkenas/inputs\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":609,"value":"tippy = require(\"https://unpkg.com/tippy.js@2.5.4/dist/tippy.all.min.js\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":620,"value":"styles = html`\n`","pinned":true,"hidden":false,"mode":"ojs"},{"id":954,"value":"// div_height = 0.9 * screen.availHeight\ndiv_height = 0.9 * window.innerHeight","pinned":true,"hidden":false,"mode":"ojs"},{"id":1004,"value":"game_height = div_height / 20","pinned":true,"hidden":false,"mode":"ojs"},{"id":964,"value":"div_width = 0.98*width","pinned":true,"hidden":false,"mode":"ojs"},{"id":1002,"value":"team_width = div_width / 9","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W36","stdlib":"1","titling":"auto"}