{
const x = d3.scaleBand().domain(d3.range(0, arr)).range([0, 600]);
const height = 300;
const y = d3
.scaleLinear()
.domain([0, Math.max(...groupped.map((g) => g.length / data.length)) * 1.1])
.range([0, height]);
const svg = d3.create("svg");
svg.attr("height", height + 100).attr("width", 700);
const graph = svg.append("g").attr("transform", "translate(50,50)");
const r = graph.selectAll("rect").data(groupped);
r.enter()
.append("rect")
.call((e) => e.append("title").text((d) => d.length))
.merge(r)
.attr("x", (d, i) => x(i))
.attr("y", (d) => height - y(d.length / data.length))
.attr("width", x.bandwidth())
.attr("height", (d) => y(d.length / data.length));
graph.append("g").call(d3.axisLeft(y));
graph
.append("g")
.attr("transform", "translate(0," + height + ")")
.call(d3.axisBottom(x));
return svg.node();
}