function create_winloss_chart(conference) {
let conference_games = games_by_conference.get(conference);
let teams = _.uniq(
conference_games.map((o) => [o.WTeamName, o.LTeamName]).flat()
);
let losses_by_team = d3.rollup(
conference_games,
(a) => a.length,
(o) => o.LTeamName
);
let wins_by_team = d3.rollup(
conference_games,
(a) => a.length,
(o) => o.WTeamName
);
let div = d3
.create("div")
.style("position", "relative")
.style("width", "260px")
.style("background", "#dedede")
.style("border-radius", "10px")
.style("border", "solid 0.2px #666");
div.append("h3").text(conference_games[0].WTeamConf);
let table = div
.append("table")
.style("width", "240px")
.style("margin-left", "10px");
let head = table.append("tr");
head.append("th").text("Team");
head.append("th").style("text-align", "center").text("Record");
d3.sort(teams, (team) => -wins_by_team.get(team)).forEach(function (team) {
if (team) {
let row = table.append("tr");
row.append("td").text(team.replace(/_/g, " "));
row
.append("td")
.style("text-align", "center")
.text(
`${wins_by_team.get(team) || 0}-${losses_by_team.get(team) || 0}`
);
}
});
return div.node();
}